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.2 4.3.1 4.3.0 4.3.0-beta3 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 All 455 releases
← All changes | assets/css/app-rtl.css +121 -1078 4.3.2 → 3.22.2 View file →
@@ -1,7 +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";
2 3 @import "//fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&display=swap";
3 -@import "//fonts.googleapis.com/css2?family=Source%20Serif%20Pro:wght@700&display=swap";
4 +@import "//fonts.googleapis.com/css2?family=Source%20Serif%20Pro&display=swap";
4 5 :root {
5 6 --color-box-shadow-color: rgba(0, 0, 0, 0.05);
6 7 }
7 8
@@ -120,30 +121,30 @@
120 121 --button-primary-hover-background-color: #F5D0FE;
121 122 --button-primary-active-background-color: #F3BAFD;
122 123 --button-primary-color: #0C0D0E;
123 124 --button-secondary-background-color: #69727D;
124 - --button-secondary-hover-background-color: rgb(81.7173913043, 88.7217391304, 97.2826086957);
125 - --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;
126 127 --button-secondary-color: #ffffff;
127 128 --button-danger-background-color: #DC2626;
128 - --button-danger-hover-background-color: rgb(178.25, 28.75, 28.75);
129 - --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;
130 131 --button-danger-color: #ffffff;
131 132 --button-cta-background-color: #93003f;
132 - --button-cta-hover-background-color: rgb(96, 0, 41.1428571429);
133 - --button-cta-active-background-color: rgb(45, 0, 19.2857142857);
133 + --button-cta-hover-background-color: #600029;
134 + --button-cta-active-background-color: #2d0013;
134 135 --button-cta-color: #ffffff;
135 136 --button-brand-background-color: #93003f;
136 - --button-brand-hover-background-color: rgb(96, 0, 41.1428571429);
137 - --button-brand-active-background-color: rgb(45, 0, 19.2857142857);
137 + --button-brand-hover-background-color: #600029;
138 + --button-brand-active-background-color: #2d0013;
138 139 --button-brand-color: #ffffff;
139 140 --button-link-background-color: #515962;
140 - --button-link-hover-background-color: rgb(57.9217877095, 63.6424581006, 70.0782122905);
141 - --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;
142 143 --button-link-color: #ffffff;
143 144 --button-disabled-background-color: #D5D8DC;
144 - --button-disabled-hover-background-color: rgb(185.1818181818, 190.1688311688, 196.8181818182);
145 - --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;
146 147 --button-disabled-color: #ffffff;
147 148 color: var(--button-background-color, currentColor);
148 149 font-size: var(--button-font-size, inherit);
149 150 font-weight: 500;
@@ -163,25 +164,25 @@
163 164 --button-primary-hover-background-color: #EB8EFB;
164 165 --button-primary-active-background-color: #F3BAFD;
165 166 --button-secondary-background-color: #BABFC5;
166 167 --button-secondary-color: #fff;
167 - --button-secondary-hover-background-color: rgb(158.2913385827, 165.2992125984, 173.7086614173);
168 - --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;
169 170 --button-cta-background-color: #93003f;
170 - --button-cta-hover-background-color: rgb(96, 0, 41.1428571429);
171 - --button-cta-active-background-color: rgb(45, 0, 19.2857142857);
171 + --button-cta-hover-background-color: #600029;
172 + --button-cta-active-background-color: #2d0013;
172 173 --button-cta-color: #fff;
173 - --button-brand-hover-background-color: rgb(96, 0, 41.1428571429);
174 - --button-brand-active-background-color: rgb(45, 0, 19.2857142857);
174 + --button-brand-hover-background-color: #600029;
175 + --button-brand-active-background-color: #2d0013;
175 176 --button-brand-color: #fff;
176 177 --button-brand-background-color: #93003f;
177 178 --button-link-background-color: #515962;
178 - --button-link-hover-background-color: rgb(57.9217877095, 63.6424581006, 70.0782122905);
179 - --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;
180 181 --button-link-color: #ffffff;
181 182 --button-disabled-background-color: #69727D;
182 - --button-disabled-hover-background-color: rgb(81.7173913043, 88.7217391304, 97.2826086957);
183 - --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;
184 185 --button-disabled-color: #fff;
185 186 }
186 187 .eps-button--contained {
187 188 color: var(--button-color);
@@ -302,9 +303,9 @@
302 303 --warning-bg: #FFFBEB;
303 304 --body-color: #515962;
304 305 --body-bg: #ffffff;
305 306 --link-color: #515962;
306 - --link-hover-color: rgb(46.3826815642, 50.9636871508, 56.1173184358);
307 + --link-hover-color: #2e3338;
307 308 --hr-color: #E6E8EA;
308 309 --box-shadow-color: theme-colors(dark);
309 310 --display-1-color: #515962;
310 311 --display-2-color: #515962;
@@ -356,9 +357,9 @@
356 357 --danger-bg: #390A0A;
357 358 --body-color: #BABFC5;
358 359 --body-bg: #1f2124;
359 360 --link-color: #0077CC;
360 - --link-hover-color: rgb(46.3826815642, 50.9636871508, 56.1173184358);
361 + --link-hover-color: #2e3338;
361 362 --hr-color: #333438;
362 363 --box-shadow-color: rgba(0, 0, 0, 0.15);
363 364 --display-1-color: #BABFC5;
364 365 --display-2-color: #BABFC5;
@@ -491,9 +492,9 @@
491 492 button {
492 493 border-radius: 0;
493 494 }
494 495
495 -button:focus:not(:where([data-module=onboarding] *)) {
496 +button:focus {
496 497 outline: 1px dotted;
497 498 outline: 5px auto -webkit-focus-ring-color;
498 499 }
499 500
@@ -692,10 +693,10 @@
692 693 height: 0;
693 694 }
694 695 .video-wrapper iframe {
695 696 position: absolute;
696 - inset-block-start: 0;
697 - inset-inline-start: 0;
697 + top: 0;
698 + right: 0;
698 699 width: 100%;
699 700 height: 100%;
700 701 }
701 702
@@ -751,12 +752,12 @@
751 752 justify-content: center;
752 753 position: fixed;
753 754 height: 100%;
754 755 width: 100%;
755 - inset-block-end: 0;
756 - inset-inline-start: 0;
757 756 background-color: var(--app-lightbox-background-color);
758 757 z-index: 1040;
758 + bottom: 0;
759 + right: 0;
759 760 }
760 761 .eps-app__header {
761 762 flex-shrink: 0;
762 763 font-size: 0.9375rem;
@@ -796,11 +797,12 @@
796 797 width: 1.75rem;
797 798 height: 1.75rem;
798 799 line-height: 1.75rem;
799 800 text-align: center;
800 - font-size: 1.75rem;
801 + font-size: calc(0.4 * 1.75rem);
801 802 border-radius: 50%;
802 - color: var(--app-logo-background-color);
803 + color: var(--app-logo-color);
804 + background-color: var(--app-logo-background-color);
803 805 }
804 806 .eps-app__logo:not(:last-child) {
805 807 margin-inline-end: 0.625rem;
806 808 }
@@ -902,11 +904,11 @@
902 904 }
903 905
904 906 .elementor-loader-wrapper {
905 907 position: absolute;
906 - inset-block-start: 50%;
907 - inset-inline-start: 50%;
908 - transform: translate(calc(-50% * var(--direction-multiplier)), -50%);
908 + top: 50%;
909 + left: 50%;
910 + transform: translate(-50%, -50%);
909 911 width: 300px;
910 912 display: flex;
911 913 flex-direction: column;
912 914 align-items: center;
@@ -936,13 +938,13 @@
936 938 }
937 939 .elementor-loader-box:nth-of-type(1) {
938 940 width: 20%;
939 941 height: 100%;
940 - inset-block-start: 0;
941 - inset-inline-start: 0;
942 + right: 0;
943 + top: 0;
942 944 }
943 945 .elementor-loader-box:not(:nth-of-type(1)) {
944 - inset-inline-end: 0;
946 + left: 0;
945 947 height: 20%;
946 948 width: 60%;
947 949 }
948 950 .elementor-loader-box:nth-of-type(2) {
@@ -1052,9 +1054,9 @@
1052 1054 }
1053 1055 .e-app-import-export-wizard-step__notice {
1054 1056 display: block;
1055 1057 position: sticky;
1056 - 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. */
1057 1059 color: var(--e-app-import-export-wizard-step-block-end-text-color);
1058 1060 font-style: italic;
1059 1061 margin-block-end: 0;
1060 1062 }
@@ -1070,9 +1072,9 @@
1070 1072 --e-app-import-export-page-header-description-color: #69727D;
1071 1073 margin-block-end: 2.75rem;
1072 1074 }
1073 1075 .e-app-import-export-page-header__content-wrapper {
1074 - max-width: 655px;
1076 + max-width: 645px;
1075 1077 }
1076 1078 .e-app-import-export-page-header__heading {
1077 1079 color: var(--e-app-import-export-page-header-heading-color);
1078 1080 }
@@ -1169,8 +1171,11 @@
1169 1171 border: var(--card-border);
1170 1172 border-radius: 0.1875rem;
1171 1173 transition: 0.3s;
1172 1174 font-size: 0.75rem;
1175 + /*
1176 + todo: TBD: Optionally remove headline styling in favor of a global atom depending on variation needs
1177 + */
1173 1178 }
1174 1179 .eps-card__header {
1175 1180 padding: 0.625rem;
1176 1181 border-block-end: var(--card-header-footer-border);
@@ -1180,13 +1185,8 @@
1180 1185 }
1181 1186 .eps-card__header--padding {
1182 1187 padding: var(--eps-card-header-padding);
1183 1188 }
1184 -.eps-card {
1185 - /*
1186 - todo: TBD: Optionally remove headline styling in favor of a global atom depending on variation needs
1187 - */
1188 -}
1189 1189 .eps-card__headline {
1190 1190 color: var(--card-headline-color);
1191 1191 margin-block-end: 0;
1192 1192 font-weight: 500;
@@ -1214,14 +1214,14 @@
1214 1214 object-fit: contain;
1215 1215 -o-object-position: top;
1216 1216 object-position: top;
1217 1217 position: absolute;
1218 - inset-block-start: 0;
1219 - inset-inline-start: 0;
1218 + top: 0;
1219 + right: 0;
1220 1220 }
1221 1221 .eps-card__image-overlay {
1222 1222 position: absolute;
1223 - inset-block-start: 0;
1223 + top: 0;
1224 1224 background-color: var(--card-image-overlay-background-color);
1225 1225 z-index: 1;
1226 1226 width: 100%;
1227 1227 height: 100%;
@@ -1268,10 +1268,10 @@
1268 1268 .eps-menu-item::before {
1269 1269 content: "";
1270 1270 display: block;
1271 1271 position: absolute;
1272 - inset-block-start: 0;
1273 - inset-inline-start: 0;
1272 + top: 0;
1273 + right: 0;
1274 1274 height: 100%;
1275 1275 width: var(--menu-item-pointer-width);
1276 1276 background-color: #0C0D0E;
1277 1277 }
@@ -1867,9 +1867,12 @@
1867 1867 .eps-modal__overlay {
1868 1868 background: rgba(0, 0, 0, 0.5);
1869 1869 position: fixed;
1870 1870 display: flex;
1871 - inset: 0;
1871 + top: 0;
1872 + right: 0;
1873 + width: 100%;
1874 + height: 100%;
1872 1875 align-items: center;
1873 1876 justify-content: center;
1874 1877 z-index: 1030;
1875 1878 }
@@ -2137,13 +2140,16 @@
2137 2140 position: absolute;
2138 2141 z-index: 1050;
2139 2142 margin-block-start: 9px;
2140 2143 transform: translateX(-50%);
2141 - inset-inline-start: 0.25rem;
2144 + right: 0.25rem;
2142 2145 }
2143 2146 .eps-popover__background {
2144 2147 position: fixed;
2145 - inset: 0;
2148 + top: 0;
2149 + bottom: 0;
2150 + right: 0;
2151 + left: 0;
2146 2152 z-index: 1030;
2147 2153 }
2148 2154 .eps-popover__container {
2149 2155 position: relative;
@@ -2154,10 +2160,10 @@
2154 2160 position: absolute;
2155 2161 width: 16px;
2156 2162 height: 9px;
2157 2163 margin: 0 0.1875rem 9px;
2158 - inset-block-start: -9px;
2159 - inset-inline-start: 50%;
2164 + top: -9px;
2165 + right: 50%;
2160 2166 transform: translateX(-50%);
2161 2167 border-color: transparent;
2162 2168 border-style: solid;
2163 2169 border-width: 0 calc(16px / 2) 9px calc(16px / 2);
@@ -2162,20 +2168,8 @@
2162 2168 border-style: solid;
2163 2169 border-width: 0 calc(16px / 2) 9px calc(16px / 2);
2164 2170 border-block-end-color: var(--popover-arrow-color);
2165 2171 }
2166 -.eps-popover--arrow-start::before {
2167 - inset-inline-start: 0.1875rem;
2168 - transform: none;
2169 -}
2170 -.eps-popover--arrow-end::before {
2171 - inset-inline-start: auto;
2172 - inset-inline-end: 0.1875rem;
2173 - transform: none;
2174 -}
2175 -.eps-popover--arrow-none::before {
2176 - display: none;
2177 -}
2178 2172 .eps-popover__item {
2179 2173 padding: 0.3125rem 1rem;
2180 2174 background-color: var(--popover-item-background-color);
2181 2175 color: var(--popover-item-color);
@@ -2227,14 +2221,14 @@
2227 2221 }
2228 2222
2229 2223 :root {
2230 2224 --checkbox-border-color: #9DA5AE;
2231 - --checkbox-hover-border-color: rgb(143.0391061453, 152.1787709497, 162.4608938547);
2232 - --checkbox-active-border-color: rgb(170.9608938547, 177.8212290503, 185.5391061453);
2225 + --checkbox-hover-border-color: #8f98a2;
2226 + --checkbox-active-border-color: #abb2ba;
2233 2227 --checkbox-background-color: #ffffff;
2234 2228 --checkbox-checked-background-color: #515962;
2235 - --checkbox-checked-hover-background-color: rgb(69.4608938547, 76.3212290503, 84.0391061453);
2236 - --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;
2237 2231 --checkbox-checked-disabled-background-color: #D5D8DC;
2238 2232 --checkbox-indicator-color: #ffffff;
2239 2233 --checkbox-error-background-color: #DC2626;
2240 2234 }
@@ -2293,8 +2287,12 @@
2293 2287 }
2294 2288 .eps-checkbox--rounded {
2295 2289 border-radius: 50%;
2296 2290 }
2291 +.eps-checkbox--indeterminate {
2292 + --checkbox-background-color: var(--checkbox-checked-background-color);
2293 + --checkbox-border-color: var(--checkbox-checked-background-color);
2294 +}
2297 2295 .eps-checkbox--indeterminate::after {
2298 2296 display: inline-block;
2299 2297 margin-block-end: 0;
2300 2298 content: " ";
@@ -2302,12 +2300,8 @@
2302 2300 height: 0;
2303 2301 transform: rotate(0deg);
2304 2302 border-block-start: 1px solid #ffffff;
2305 2303 }
2306 -.eps-checkbox--indeterminate {
2307 - --checkbox-background-color: var(--checkbox-checked-background-color);
2308 - --checkbox-border-color: var(--checkbox-checked-background-color);
2309 -}
2310 2304 .eps-checkbox--error::before, .eps-checkbox--error::after, .eps-checkbox--error:checked::before, .eps-checkbox--error:checked::after {
2311 2305 display: inline-block;
2312 2306 margin-block-end: 0;
2313 2307 content: " ";
@@ -2355,10 +2349,10 @@
2355 2349 width: 375px;
2356 2350 }
2357 2351 .eps-dialog__close-button {
2358 2352 position: absolute;
2359 - inset-block-start: -2.75rem;
2360 - inset-inline-end: -2.75rem;
2353 + top: -2.75rem;
2354 + left: -2.75rem;
2361 2355 margin-block-start: 0.625rem;
2362 2356 margin-inline-end: 0.625rem;
2363 2357 z-index: 1040;
2364 2358 font-size: 1.25rem;
@@ -2398,10 +2392,10 @@
2398 2392 }
2399 2393 .e-app__popover:before {
2400 2394 content: "";
2401 2395 position: absolute;
2402 - inset-block-start: -16px;
2403 - inset-inline-end: var(--popover-arrow-offset-end, 22px);
2396 + top: -16px;
2397 + left: var(--popover-arrow-offset-end, 22px);
2404 2398 border: 8px solid transparent;
2405 2399 border-block-end-color: #fff;
2406 2400 }
2407 2401
@@ -2444,11 +2438,8 @@
2444 2438 --eps-text-field-background-color: transparent;
2445 2439 --eps-text-field-placeholder-color: #69727D;
2446 2440 --eps-text-field-outlined-border-color: #9DA5AE;
2447 2441 --eps-text-field-outlined-focus-border-color: #515962;
2448 - --eps-text-field-standard-border-color: #9DA5AE;
2449 - --eps-text-field-standard-focus-border-color: #515962;
2450 - --border: 1px solid var(--eps-text-field-outlined-border-color);
2451 2442 width: 100%;
2452 2443 color: var(--eps-text-field-color);
2453 2444 background-color: var(--eps-text-field-background-color);
2454 2445 border: 0;
@@ -2460,22 +2451,14 @@
2460 2451 line-height: 1.5;
2461 2452 }
2462 2453 .eps-text-field--outlined {
2463 2454 border-radius: 0.1875rem;
2464 - border: var(--border);
2455 + border: 1px solid var(--eps-text-field-outlined-border-color);
2465 2456 padding: 0.625rem;
2466 2457 }
2467 2458 .eps-text-field--outlined:focus {
2468 2459 border-color: var(--eps-text-field-outlined-focus-border-color);
2469 2460 }
2470 -.eps-text-field--standard {
2471 - padding-top: 0.625rem;
2472 - padding-bottom: 0.625rem;
2473 - border-bottom: var(--border);
2474 -}
2475 -.eps-text-field--standard:focus {
2476 - border-color: var(--eps-text-field-standard-focus-border-color);
2477 -}
2478 2461 .eps-text-field::-moz-placeholder {
2479 2462 color: var(--eps-text-field-placeholder-color);
2480 2463 font-family: Roboto, Arial, Helvetica, Verdana, sans-serif;
2481 2464 font-size: 0.875rem;
@@ -2502,14 +2485,8 @@
2502 2485 }
2503 2486 .eps-theme-dark--outlined:focus {
2504 2487 border-color: var(--eps-text-field-outlined-focus-border-color);
2505 2488 }
2506 -.eps-theme-dark--standard {
2507 - border-color: var(--eps-text-field-standard-border-color);
2508 -}
2509 -.eps-theme-dark--standard:focus {
2510 - border-color: var(--eps-text-field-standard-focus-border-color);
2511 -}
2512 2489
2513 2490 .e-app-import-export-content-layout {
2514 2491 display: flex;
2515 2492 justify-content: center;
@@ -2644,8 +2621,11 @@
2644 2621
2645 2622 .e-app-export-kit {
2646 2623 padding-block-end: 1.25rem;
2647 2624 }
2625 +.e-app-export-kit-information {
2626 + margin-block-start: 1.25rem;
2627 +}
2648 2628 .e-app-export-kit-information__field-header {
2649 2629 margin-block-end: 0.625rem;
2650 2630 }
2651 2631 .e-app-export-kit-information__label {
@@ -2653,26 +2633,14 @@
2653 2633 }
2654 2634 .e-app-export-kit-information__info-icon {
2655 2635 margin-inline-start: 0.625rem;
2656 2636 }
2657 -.e-app-export-kit-information__content {
2658 - gap: 16px;
2637 +.e-app-export-kit-info-modal__icon {
2638 + padding-inline-start: 0.625rem;
2659 2639 }
2660 -.e-app-export-kit-information__field--error {
2661 - border-color: var(--e-a-color-danger);
2640 +.e-app-export-kit-info-modal__heading {
2641 + margin-block-end: 1.25rem;
2662 2642 }
2663 -.e-app-export-kit-information__error-container {
2664 - height: 20px;
2665 - display: flex;
2666 - align-items: flex-start;
2667 - margin-block-start: 4px;
2668 -}
2669 -.e-app-export-kit-information__validation-error {
2670 - color: var(--e-a-color-danger);
2671 -}
2672 -.e-app-export-kit__content {
2673 - gap: 20px;
2674 -}
2675 2643
2676 2644 .e-app-import-export-info-modal__section:not(:first-child) {
2677 2645 margin-block-start: 1.875rem;
2678 2646 }
@@ -2719,9 +2687,9 @@
2719 2687 outline: none;
2720 2688 }
2721 2689 .eps-collapse__icon {
2722 2690 transition: all 150ms;
2723 - scale: calc(1 * var(--direction-multiplier)) 1;
2691 + transform: rotate(180deg);
2724 2692 }
2725 2693 .eps-collapse__content {
2726 2694 margin-block-start: 0.625rem;
2727 2695 display: none;
@@ -2800,8 +2768,9 @@
2800 2768 .e-kit-library__filter-indication-button {
2801 2769 margin-inline-start: 1.5rem;
2802 2770 }
2803 2771
2772 +#eps-app-header-btn-apply,
2804 2773 #eps-app-header-btn-promotion,
2805 2774 #eps-app-header-btn-connect {
2806 2775 margin-inline-start: 0.625rem;
2807 2776 margin-inline-end: 0.625rem;
@@ -2806,17 +2775,8 @@
2806 2775 margin-inline-start: 0.625rem;
2807 2776 margin-inline-end: 0.625rem;
2808 2777 }
2809 2778
2810 -#eps-app-header-btn-apply {
2811 - margin-inline-start: 0.625rem;
2812 -}
2813 -
2814 -#eps-app-header-btn-download {
2815 - margin-inline-end: 1rem;
2816 - margin-inline-start: 1rem;
2817 -}
2818 -
2819 2779 .e-kit-library__apply-button {
2820 2780 display: flex;
2821 2781 align-items: center;
2822 2782 justify-content: center;
@@ -2833,8 +2793,11 @@
2833 2793
2834 2794 .e-kit-library__kit-item-overlay {
2835 2795 height: 100%;
2836 2796 }
2797 +.e-kit-library__kit-item-overlay > *:first-child {
2798 + flex: 1;
2799 +}
2837 2800 .e-kit-library__kit-item-overlay-overview-button {
2838 2801 display: flex;
2839 2802 flex-direction: column;
2840 2803 align-items: center;
@@ -2864,104 +2827,16 @@
2864 2827 .e-kit-library__kit-item-overlay-promotion-button > * {
2865 2828 margin: 0 3px;
2866 2829 }
2867 2830 .e-kit-library__kit-item-subscription-plan-badge {
2868 - --e-a-color-brand: #467FF7;
2869 -}
2870 -.e-kit-library__kit-item-subscription-plan-badge.promoted {
2871 - --e-a-color-brand: #92003B;
2872 -}
2873 -.e-kit-library__kit-item-subscription-plan-badge {
2874 2831 position: absolute;
2875 - inset-block-start: 0;
2876 - inset-inline-end: 0;
2832 + top: 0;
2833 + left: 0;
2877 2834 margin: 0.3125rem;
2878 2835 background-color: var(--e-a-color-brand);
2879 2836 color: #ffffff;
2880 2837 text-transform: uppercase;
2881 2838 }
2882 -.e-kit-library__kit-item-header {
2883 - position: relative;
2884 -}
2885 -.e-kit-library__kit-item-lock-icon {
2886 - font-size: 14px;
2887 - margin-inline-end: 8px;
2888 - color: var(--card-headline-color);
2889 - cursor: pointer;
2890 -}
2891 -.e-kit-library__kit-item-actions-menu i {
2892 - font-size: 16px;
2893 -}
2894 -.e-kit-library__kit-item-actions-popover {
2895 - display: flex;
2896 - flex-direction: column;
2897 - align-items: start;
2898 - min-width: 0;
2899 - padding: 12px 0;
2900 - position: absolute;
2901 - inset-block-start: 25px;
2902 - inset-inline-start: 100%;
2903 - transform: translateX(calc(-100% * var(--direction-multiplier)));
2904 -}
2905 -.e-kit-library__kit-item-actions-popover-item {
2906 - display: flex;
2907 - height: 30px;
2908 - width: 100%;
2909 - align-items: center;
2910 - gap: 8px;
2911 - padding: 0 12px;
2912 - cursor: pointer;
2913 -}
2914 -.e-kit-library__kit-item-actions-popover-item i {
2915 - font-size: 16px;
2916 -}
2917 -.e-kit-library__kit-item-actions-popover-item:hover {
2918 - background-color: var(--e-a-bg-hover);
2919 -}
2920 -.e-kit-library__kit-item-actions-popover-item--danger {
2921 - color: var(--e-a-color-danger);
2922 -}
2923 -.e-kit-library__kit-item-actions-popover-item--danger:hover {
2924 - background-color: var(--e-a-bg-danger);
2925 -}
2926 -.e-kit-library__kit-item-actions-popover-item--danger i {
2927 - color: var(--e-a-color-danger);
2928 -}
2929 -.e-kit-library__kit-item-cloud-overlay {
2930 - height: 100%;
2931 - display: flex;
2932 - flex-direction: column;
2933 - align-items: center;
2934 - justify-content: center;
2935 -}
2936 -.e-kit-library__kit-item-cloud-overlay-import-button {
2937 - display: flex;
2938 - align-items: center;
2939 - justify-content: center;
2940 - padding: 8px 22px;
2941 - gap: 8px;
2942 -}
2943 -.e-kit-library__kit-item-cloud-overlay-import-button > i {
2944 - font-size: 20px;
2945 - font-weight: 600;
2946 -}
2947 -.e-kit-library__kit-item-cloud-overlay-import-button > span {
2948 - font-size: 15px;
2949 -}
2950 -.e-kit-library__kit-item-cloud-overlay i.eicon-lock {
2951 - font-size: 48px;
2952 - color: rgba(255, 255, 255, 0.8);
2953 - cursor: pointer;
2954 -}
2955 -.e-kit-library__kit-item--locked {
2956 - opacity: 0.6;
2957 -}
2958 -.e-kit-library__kit-item--locked .eps-card__image {
2959 - opacity: 0.7;
2960 -}
2961 -.e-kit-library__kit-item--locked .eps-card__overlay {
2962 - background-color: rgba(0, 0, 0, 0.5);
2963 -}
2964 2839
2965 2840 :root {
2966 2841 --e-kit-library-header-back-border: 1px solid var(--e-a-border-color);
2967 2842 --e-kit-library-header-back-color: #69727D;
@@ -2986,9 +2861,9 @@
2986 2861 flex: 1;
2987 2862 height: 100%;
2988 2863 }
2989 2864 .e-kit-library__header-back .eps-icon {
2990 - scale: calc(1 * var(--direction-multiplier)) 1;
2865 + transform: rotate(180deg);
2991 2866 }
2992 2867
2993 2868 .e-kit-library__page-loader {
2994 2869 width: 100%;
@@ -3046,10 +2921,10 @@
3046 2921 font-size: 1.25rem;
3047 2922 padding: 0.625rem;
3048 2923 color: #69727D;
3049 2924 position: absolute;
3050 - inset-block-start: 0;
3051 - inset-inline-start: 0;
2925 + top: 0;
2926 + right: 0;
3052 2927 height: 100%;
3053 2928 display: flex;
3054 2929 align-items: center;
3055 2930 justify-content: center;
@@ -3061,10 +2936,10 @@
3061 2936 font-size: 0.875rem;
3062 2937 padding: 0.625rem;
3063 2938 color: #69727D;
3064 2939 position: absolute;
3065 - inset-block-start: 0;
3066 - inset-inline-end: 0;
2940 + top: 0;
2941 + left: 0;
3067 2942 height: 100%;
3068 2943 display: flex;
3069 2944 align-items: center;
3070 2945 justify-content: center;
@@ -3099,10 +2974,11 @@
3099 2974 .eps-sort-select__select-wrapper::after {
3100 2975 content: "\e8ad";
3101 2976 font-family: eicons;
3102 2977 position: absolute;
3103 - inset-inline-end: 0.625rem;
3104 - inset-block: 0;
2978 + left: 0.625rem;
2979 + top: 0;
2980 + bottom: 0;
3105 2981 color: #69727D;
3106 2982 display: flex;
3107 2983 align-items: center;
3108 2984 justify-content: center;
@@ -3199,14 +3075,13 @@
3199 3075 }
3200 3076 .e-kit-library__index-layout-heading {
3201 3077 padding: 1.875rem 2.75rem;
3202 3078 position: sticky;
3203 - inset-block-start: -1px;
3079 + top: -1px;
3204 3080 width: 100%;
3205 3081 z-index: 2;
3206 3082 background-color: var(--app-background-color);
3207 3083 gap: 1.5rem;
3208 - align-items: center;
3209 3084 }
3210 3085 .e-kit-library__index-layout-heading-search, .e-kit-library__index-layout-heading-sort {
3211 3086 min-width: 265px;
3212 3087 }
@@ -3212,13 +3087,8 @@
3212 3087 }
3213 3088 .e-kit-library__index-layout-heading-search {
3214 3089 flex: 1;
3215 3090 }
3216 -.e-kit-library__index-layout-heading-quota {
3217 - display: flex;
3218 - align-items: center;
3219 - justify-content: flex-end;
3220 -}
3221 3091 .e-kit-library__index-layout-main {
3222 3092 padding-block-start: 0;
3223 3093 padding-block-end: 1.5rem;
3224 3094 overflow-y: hidden;
@@ -3227,45 +3097,8 @@
3227 3097 display: flex;
3228 3098 flex-direction: column;
3229 3099 justify-content: space-between;
3230 3100 }
3231 -.e-kit-library__index-layout-main.e-kit-library__connect-container {
3232 - justify-content: center;
3233 - align-items: center;
3234 -}
3235 -.e-kit-library__connect-button {
3236 - background-color: var(--e-a-btn-bg-primary);
3237 - color: var(--e-a-btn-color);
3238 - border-radius: 4px;
3239 - padding: 8px;
3240 -}
3241 -.e-kit-library__connect-button:hover {
3242 - opacity: 0.8;
3243 -}
3244 -.e-kit-library__upgrade-button {
3245 - background-color: var(--e-a-color-accent);
3246 - color: var(--e-a-color-txt-invert);
3247 - border-radius: 4px;
3248 - padding: 8px;
3249 -}
3250 -.e-kit-library__upgrade-button:hover {
3251 - opacity: 0.8;
3252 -}
3253 -.e-kit-library .eicon-library-cloud-connect,
3254 -.e-kit-library .eicon-library-subscription-upgrade {
3255 - font-size: 65px;
3256 -}
3257 -.e-kit-library .connect-badge {
3258 - color: #C00BB9;
3259 - margin-inline-start: 10px;
3260 -}
3261 -.e-kit-library .upgrade-badge {
3262 - color: #93003f;
3263 - border: 1px solid #93003f;
3264 - border-radius: 10px;
3265 - padding: 2px 6px;
3266 - margin-inline-start: 10px;
3267 -}
3268 3101
3269 3102 .e-kit-library__tags-filter {
3270 3103 --e-kit-library-item-sidebar-header-title-color: #515962;
3271 3104 --e-kit-library-item-sidebar-description-color: #515962;
@@ -3347,10 +3180,10 @@
3347 3180 }
3348 3181
3349 3182 .e-kit-library__preview-loader {
3350 3183 position: absolute;
3351 - inset-block-start: 0;
3352 - inset-inline-start: 0;
3184 + top: 0;
3185 + right: 0;
3353 3186 z-index: 0;
3354 3187 }
3355 3188 .e-kit-library__preview-iframe {
3356 3189 border: none;
@@ -3378,10 +3211,10 @@
3378 3211 align-items: center;
3379 3212 justify-content: center;
3380 3213 font-size: 0.875rem;
3381 3214 position: absolute;
3382 - inset-block-start: 50%;
3383 - inset-inline-end: var(--e-app-collapse-toggle-icon-spacing);
3215 + top: 50%;
3216 + left: var(--e-app-collapse-toggle-icon-spacing);
3384 3217 transform: translateY(-50%);
3385 3218 }
3386 3219 .e-app-collapse-toggle__icon:before {
3387 3220 transition: all 0.2s linear;
@@ -3396,10 +3229,10 @@
3396 3229 display: block;
3397 3230 }
3398 3231
3399 3232 [dir=rtl] .e-app-collapse-toggle__icon {
3400 - inset-inline-start: var(--e-app-collapse-toggle-icon-spacing);
3401 - inset-inline-end: initial;
3233 + left: initial;
3234 + right: var(--e-app-collapse-toggle-icon-spacing);
3402 3235 }
3403 3236
3404 3237 .eps-theme-dark .e-app-collapse {
3405 3238 --e-app-collapse-icon-color: #BABFC5;
@@ -3526,10 +3359,10 @@
3526 3359 font-size: 1.85rem;
3527 3360 }
3528 3361 .e-app-import-export-loader--absolute-center {
3529 3362 position: absolute;
3530 - inset-block-start: 50%;
3531 - inset-inline-start: 50%;
3363 + top: 50%;
3364 + right: 50%;
3532 3365 transform: translateX(-50%) translateY(-50%);
3533 3366 }
3534 3367
3535 3368 .eps-theme-dark .e-app-import-export-loader {
@@ -3562,163 +3395,8 @@
3562 3395 .e-app-import-failed-plugins-notice {
3563 3396 margin-block-end: 1.25rem;
3564 3397 }
3565 3398
3566 -.e-app-export-actions-container {
3567 - display: flex;
3568 - gap: 15px;
3569 - width: 100%;
3570 - justify-content: flex-end;
3571 -}
3572 -
3573 -.e-kit-library__quota-bar {
3574 - display: flex;
3575 - align-items: center;
3576 -}
3577 -.e-kit-library__quota-bar__container {
3578 - display: flex;
3579 - flex-direction: column;
3580 - gap: 8px;
3581 - min-width: 230px;
3582 -}
3583 -.e-kit-library__quota-bar__header {
3584 - display: flex;
3585 - justify-content: space-between;
3586 - align-items: center;
3587 -}
3588 -.e-kit-library__quota-bar__label {
3589 - color: var(--body-color);
3590 - font-weight: 400;
3591 - white-space: nowrap;
3592 - font-size: 12px;
3593 -}
3594 -.e-kit-library__quota-bar__progress-container {
3595 - width: 100%;
3596 - height: 4px;
3597 - overflow: hidden;
3598 - position: relative;
3599 -}
3600 -.e-kit-library__quota-bar__progress-container--empty {
3601 - background-color: #F0ABFC;
3602 -}
3603 -.e-kit-library__quota-bar__progress-container--normal {
3604 - background-color: #F0ABFC;
3605 -}
3606 -.e-kit-library__quota-bar__progress-container--warning {
3607 - background-color: rgb(251.0236220472, 216.4291338583, 157.9763779528);
3608 -}
3609 -.e-kit-library__quota-bar__progress-container--alert {
3610 - background: #93003f;
3611 -}
3612 -.e-kit-library__quota-bar__progress-bar {
3613 - height: 100%;
3614 - transition: width 0.3s ease;
3615 -}
3616 -.e-kit-library__quota-bar__progress-bar--empty {
3617 - background: transparent;
3618 -}
3619 -.e-kit-library__quota-bar__progress-bar--normal {
3620 - background: #D004D4;
3621 -}
3622 -.e-kit-library__quota-bar__progress-bar--warning {
3623 - background: #F59E0B;
3624 -}
3625 -.e-kit-library__quota-bar__progress-bar--alert {
3626 - background: #93003f;
3627 -}
3628 -.e-kit-library__quota-bar__upgrade-message {
3629 - display: flex;
3630 - align-items: center;
3631 - gap: 4px;
3632 -}
3633 -.e-kit-library__quota-bar__upgrade-link {
3634 - color: #93003f;
3635 - text-decoration: underline;
3636 - cursor: pointer;
3637 - font-size: 12px;
3638 - font-weight: 400;
3639 -}
3640 -.e-kit-library__quota-bar__upgrade-link:hover {
3641 - opacity: 0.8;
3642 -}
3643 -.e-kit-library__quota-bar__count {
3644 - color: var(--body-color);
3645 - white-space: nowrap;
3646 - font-size: 12px;
3647 -}
3648 -
3649 -:root {
3650 - --text-secondary: #3F444B;
3651 -}
3652 -
3653 -.e-kit-library__quota-notification {
3654 - display: flex;
3655 - align-items: flex-start;
3656 - justify-content: space-between;
3657 - padding: 16px 20px;
3658 - margin: 0 44px 30px;
3659 - border-radius: 4px;
3660 -}
3661 -.e-kit-library__quota-notification--warning {
3662 - background-color: #FBF1E6;
3663 - color: #3f444b;
3664 -}
3665 -.e-kit-library__quota-notification--alert {
3666 - background-color: #FDECEC;
3667 - color: #3f444b;
3668 -}
3669 -.e-kit-library__quota-notification__content {
3670 - display: flex;
3671 - align-items: flex-start;
3672 - gap: 12px;
3673 - flex: 1;
3674 -}
3675 -.e-kit-library__quota-notification__icon {
3676 - font-size: 18px;
3677 - margin-top: 1px;
3678 - flex-shrink: 0;
3679 -}
3680 -.e-kit-library__quota-notification__icon.eicon-warning-full {
3681 - color: #F59E0B;
3682 -}
3683 -.e-kit-library__quota-notification__icon.eicon-alert {
3684 - color: #DC2626;
3685 -}
3686 -.e-kit-library__quota-notification__message {
3687 - flex: 1;
3688 - line-height: 1.5;
3689 - font-size: 13px;
3690 -}
3691 -.e-kit-library__quota-notification__message span {
3692 - color: var(--text-secondary);
3693 - font-size: 13px;
3694 -}
3695 -.e-kit-library__quota-notification__action-link {
3696 - color: inherit;
3697 - text-decoration: underline;
3698 - font-size: 13px;
3699 - font-weight: 400;
3700 -}
3701 -.e-kit-library__quota-notification__action-link:hover {
3702 - opacity: 0.8;
3703 -}
3704 -.e-kit-library__quota-notification__dismiss {
3705 - background: none;
3706 - border: none;
3707 - cursor: pointer;
3708 - padding: 0;
3709 - margin-inline-start: 12px;
3710 - color: inherit;
3711 - opacity: 0.7;
3712 - flex-shrink: 0;
3713 -}
3714 -.e-kit-library__quota-notification__dismiss:hover {
3715 - opacity: 1;
3716 -}
3717 -.e-kit-library__quota-notification__dismiss i {
3718 - font-size: 14px;
3719 -}
3720 -
3721 3399 .e-onboarding {
3722 3400 font-family: "DM Sans", "Roboto", sans-serif;
3723 3401 color-scheme: light;
3724 3402 }
@@ -3777,12 +3455,8 @@
3777 3455 margin-block-start: 24px;
3778 3456 width: 325px;
3779 3457 text-align: center;
3780 3458 }
3781 -.e-onboarding__footnote:not(:has(p))::before {
3782 - content: "*";
3783 - margin-right: 5px;
3784 -}
3785 3459 .e-onboarding__footnote a {
3786 3460 text-decoration: underline;
3787 3461 color: #3A3F45;
3788 3462 }
@@ -3819,28 +3493,15 @@
3819 3493 font-size: 18px;
3820 3494 color: #3A3F45;
3821 3495 }
3822 3496
3823 -@media screen and (max-width: 1100px) {
3824 - .e-onboarding__page-content-end img {
3825 - display: none;
3826 - }
3827 -}
3828 -@media screen and (max-width: 768px) {
3829 - .e-onboarding__page-content-section-title {
3830 - font-size: 28px;
3831 - }
3832 - .e-onboarding__page-content-section-text {
3833 - font-size: 14px;
3834 - }
3835 -}
3836 3497 .e-onboarding__header-logo .eps-app__logo {
3837 - color: #0C0D0E;
3498 + background-color: #0C0D0E;
3499 + color: #ffffff;
3838 3500 width: 1.3rem;
3839 3501 height: 1.3rem;
3840 - line-height: 1.4rem;
3841 - font-size: 1.3rem;
3842 - background: unset;
3502 + line-height: 1.3rem;
3503 + font-size: 0.48rem;
3843 3504 }
3844 3505 .e-onboarding__header-logo .eps-app__logo:not(:last-child) {
3845 3506 margin-inline-end: 7px;
3846 3507 }
@@ -3867,9 +3528,9 @@
3867 3528 font-size: 12px;
3868 3529 transition: 0.5s;
3869 3530 }
3870 3531 .e-onboarding__header .eps-button__go-pro-btn:hover {
3871 - background: rgb(198, 0, 84.8571428571);
3532 + background: #c60055;
3872 3533 }
3873 3534
3874 3535 .e-onboarding__go-pro {
3875 3536 width: 288px;
@@ -3896,19 +3557,12 @@
3896 3557 .e-onboarding__go-pro-already-have {
3897 3558 text-decoration: underline;
3898 3559 }
3899 3560
3900 -@media screen and (max-width: 410px) {
3901 - .e-onboarding__header-logo img {
3902 - display: none;
3903 - }
3904 -}
3905 3561 .e-onboarding__progress-bar {
3906 3562 display: flex;
3907 3563 justify-content: center;
3908 3564 margin-block-end: 125px;
3909 - flex-wrap: wrap;
3910 - gap: 15px 22px;
3911 3565 }
3912 3566 .e-onboarding__progress-bar-item {
3913 3567 display: flex;
3914 3568 align-items: center;
@@ -3928,10 +3582,10 @@
3928 3582 border: 1px solid #69727D;
3929 3583 margin-inline-end: 8px;
3930 3584 flex-shrink: 0;
3931 3585 }
3932 -.e-onboarding__progress-bar-item-icon::after {
3933 - content: attr(data-item-count);
3586 +.e-onboarding__progress-bar-item:not(:last-child) {
3587 + margin-inline-end: 22px;
3934 3588 }
3935 3589 .e-onboarding__progress-bar-item:not(:last-child):after {
3936 3590 font-family: "eicons";
3937 3591 margin-inline-start: 22px;
@@ -3974,13 +3628,8 @@
3974 3628 }
3975 3629 .e-onboarding__button-skip:hover {
3976 3630 background-color: #F9FAFA;
3977 3631 }
3978 -.e-onboarding__button-skip--disabled {
3979 - pointer-events: none;
3980 - cursor: none;
3981 - color: #D5D8DC;
3982 -}
3983 3632 .e-onboarding__button--disabled {
3984 3633 pointer-events: none;
3985 3634 background-color: #D5D8DC;
3986 3635 color: #9EA5AD;
@@ -4014,17 +3663,8 @@
4014 3663 font-weight: 700;
4015 3664 text-align: center;
4016 3665 color: #0C0D0E;
4017 3666 }
4018 -.e-onboarding__card-text-small {
4019 - color: #0C0D0E;
4020 - text-align: center;
4021 - font-size: 18px;
4022 - font-weight: 400;
4023 - line-height: 150%;
4024 - letter-spacing: -0.18px;
4025 - margin-block-start: 6px;
4026 -}
4027 3667 .e-onboarding__card:hover {
4028 3668 box-shadow: 4px 4px 0 0 #000000;
4029 3669 }
4030 3670 .e-onboarding__card:active {
@@ -4075,168 +3715,12 @@
4075 3715 .e-onboarding__page-account .e-onboarding__checkbox-label {
4076 3716 margin-block-start: 50px;
4077 3717 }
4078 3718
4079 -.e-onboarding {
4080 - --theme-card-primary-color: #D004D4;
4081 - --theme-card-primary-shadow: 0 6px 16px rgba(208, 4, 212, 0.25);
4082 - --theme-card-hover-transform: translateY(-2px);
4083 -}
4084 3719 .e-onboarding__action-button-text {
4085 3720 margin-inline-start: 10px;
4086 3721 }
4087 -.e-onboarding__page-content-theme-variant-b .e-onboarding__page-content-section-title {
4088 - line-height: 40px;
4089 -}
4090 -.e-onboarding__page-content-theme-variant-b .e-onboarding__theme-selection-description,
4091 -.e-onboarding__page-content-theme-variant-b .e-onboarding__theme-selection-subtitle {
4092 - font-size: 18px;
4093 - font-weight: 400;
4094 - margin-block-end: 8px;
4095 - text-align: center;
4096 - color: #3A3F45;
4097 -}
4098 -.e-onboarding__page-content-theme-variant-b .e-onboarding__theme-selection-subtitle {
4099 - font-weight: 600;
4100 -}
4101 -.e-onboarding__page-content-theme-variant-b .e-onboarding__theme-cards {
4102 - display: flex;
4103 - gap: 24px;
4104 - justify-content: center;
4105 - flex-wrap: wrap;
4106 - margin-block-start: 48px;
4107 -}
4108 -.e-onboarding__page-content-theme-variant-b .e-onboarding__theme-card {
4109 - background: #ffffff;
4110 - border: 1px solid #A9A9A9;
4111 - border-radius: 8px;
4112 - padding: 16px 25px 165px;
4113 - max-width: 325px;
4114 - min-width: 280px;
4115 - cursor: pointer;
4116 - transition: none;
4117 - display: flex;
4118 - flex-direction: column;
4119 - position: relative;
4120 - overflow: hidden;
4121 - margin-block: 1px;
4122 -}
4123 -.e-onboarding__page-content-theme-variant-b .e-onboarding__theme-card::after {
4124 - content: "";
4125 - position: absolute;
4126 - inset-block-start: 14px;
4127 - inset-inline-start: 16px;
4128 - width: 20px;
4129 - height: 20px;
4130 - border-radius: 50%;
4131 - display: flex;
4132 - align-items: center;
4133 - justify-content: center;
4134 - border: 2px solid black;
4135 -}
4136 -.e-onboarding__page-content-theme-variant-b .e-onboarding__theme-card:hover, .e-onboarding__page-content-theme-variant-b .e-onboarding__theme-card--loading, .e-onboarding__page-content-theme-variant-b .e-onboarding__theme-card--selected {
4137 - border: 2px solid #0C0D0E;
4138 - margin-block: 0px;
4139 -}
4140 -.e-onboarding__page-content-theme-variant-b .e-onboarding__theme-card:hover::before, .e-onboarding__page-content-theme-variant-b .e-onboarding__theme-card--loading::before, .e-onboarding__page-content-theme-variant-b .e-onboarding__theme-card--selected::before {
4141 - content: "";
4142 - background: black;
4143 - position: absolute;
4144 - top: 14px;
4145 - left: 16px;
4146 - width: 20px;
4147 - height: 20px;
4148 - border-radius: 50%;
4149 - border: 4px solid white;
4150 -}
4151 -.e-onboarding__page-content-theme-variant-b .e-onboarding__theme-card-illustration {
4152 - display: flex;
4153 - justify-content: center;
4154 - align-items: center;
4155 - position: absolute;
4156 - inset-block-end: 0px;
4157 - width: calc(100% - 50px);
4158 -}
4159 -.e-onboarding__page-content-theme-variant-b .e-onboarding__theme-card-illustration img {
4160 - width: calc(100% - 80px);
4161 -}
4162 -.e-onboarding__page-content-theme-variant-b .e-onboarding__theme-card-content {
4163 - text-align: center;
4164 -}
4165 -.e-onboarding__page-content-theme-variant-b .e-onboarding__theme-card-label {
4166 - display: flex;
4167 - justify-content: center;
4168 - color: #69727D;
4169 - font-family: "DM Sans";
4170 - font-size: 12px;
4171 - font-weight: 400;
4172 - line-height: 150%;
4173 - letter-spacing: -0.12px;
4174 - margin-block-end: 16px;
4175 -}
4176 -.e-onboarding__page-content-theme-variant-b .e-onboarding__theme-card-label span {
4177 - font-weight: 600;
4178 - padding-inline-end: 4px;
4179 -}
4180 -.e-onboarding__page-content-theme-variant-b .e-onboarding__theme-card-title {
4181 - color: #0C0D0E;
4182 - text-align: center;
4183 - font-family: "DM Sans";
4184 - font-size: 18px;
4185 - font-weight: 700;
4186 - line-height: 130%;
4187 - letter-spacing: 0.36px;
4188 - margin-block-end: 4px;
4189 -}
4190 -.e-onboarding__page-content-theme-variant-b .e-onboarding__theme-card-description {
4191 - color: #3A3F45;
4192 - text-align: center;
4193 - font-family: "DM Sans";
4194 - font-size: 14px;
4195 - font-weight: 400;
4196 - line-height: 150%;
4197 - letter-spacing: -0.14px;
4198 - margin: 0;
4199 -}
4200 -.e-onboarding__page-content:has(.e-onboarding__page-content-theme-variant-b) {
4201 - flex-direction: column;
4202 -}
4203 -.e-onboarding__page-content-start:has(.e-onboarding__page-content-theme-variant-b) {
4204 - align-self: center;
4205 - text-align: center;
4206 - flex-basis: initial;
4207 -}
4208 -.e-onboarding:has(.e-onboarding__page-content-theme-variant-b) .e-onboarding__page-content-section-title {
4209 - line-height: 1.3;
4210 - margin-block-end: 10px;
4211 -}
4212 -.e-onboarding:has(.e-onboarding__page-content-theme-variant-b) .e-onboarding__progress-bar {
4213 - margin-block-end: 85px;
4214 -}
4215 -.e-onboarding:has(.e-onboarding__page-content-theme-variant-b) .e-onboarding__footnote {
4216 - opacity: 0;
4217 -}
4218 -.e-onboarding:has(.e-onboarding__page-content-theme-variant-b) .e-onboarding__notice {
4219 - display: flex;
4220 - justify-content: center;
4221 -}
4222 -.e-onboarding:has(.e-onboarding__page-content-theme-variant-b) .e-onboarding__footer {
4223 - justify-content: center;
4224 - padding-block-end: 40px;
4225 -}
4226 3722
4227 -@media screen and (min-width: 769px) {
4228 - .e-onboarding:has(.e-onboarding__page-content-theme-variant-b) .e-onboarding__button-skip {
4229 - position: absolute;
4230 - inset-inline-end: 30px;
4231 - }
4232 -}
4233 -@media screen and (max-width: 768px) {
4234 - .e-onboarding__footer {
4235 - flex-direction: column;
4236 - gap: 10px;
4237 - }
4238 -}
4239 3723 .e-onboarding__site-name-input {
4240 3724 margin-block-start: 80px;
4241 3725 }
4242 3726
@@ -4279,10 +3763,10 @@
4279 3763 width: auto;
4280 3764 }
4281 3765 .e-onboarding__logo-remove {
4282 3766 position: absolute;
4283 - inset-block-start: 5px;
4284 - inset-inline-end: 0;
3767 + left: 0;
3768 + top: 5px;
4285 3769 }
4286 3770 .e-onboarding__logo-remove i {
4287 3771 font-size: 16px;
4288 3772 width: 15px;
@@ -4293,8 +3777,12 @@
4293 3777 .e-onboarding__is-uploading {
4294 3778 visibility: hidden;
4295 3779 }
4296 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;
3784 +}
4297 3785 .e-onboarding__cards-grid.e-onboarding__page-content {
4298 3786 margin-block-start: 48px;
4299 3787 margin-block-end: 48px;
4300 3788 }
@@ -4300,119 +3788,15 @@
4300 3788 }
4301 3789 .e-onboarding__cards-grid .e-onboarding__card {
4302 3790 max-width: 555px;
4303 3791 }
4304 -.e-onboarding__page-goodToGo .e-onboarding__content {
4305 - display: flex;
4306 - flex-direction: column;
4307 - align-items: center;
3792 +.e-onboarding__cards-grid .e-onboarding__card:not(:last-child) {
3793 + margin-inline-end: 20px;
4308 3794 }
4309 -.e-onboarding__page-goodToGo .e-onboarding__page-content-section-title,
4310 -.e-onboarding__page-goodToGo .e-onboarding__page-content-section-text {
4311 - text-align: center;
4312 -}
4313 -.e-onboarding__page-goodToGo .e-onboarding__cards-grid {
4314 - gap: 24px;
4315 - justify-content: center;
4316 - flex-wrap: nowrap;
4317 -}
4318 -.e-onboarding__page-goodToGo .e-onboarding__card {
4319 - max-width: 388px;
4320 -}
4321 -.e-onboarding__page-goodToGo .e-onboarding__card-text {
4322 - max-width: calc(100vw - 100px);
4323 -}
4324 -.e-onboarding__page-goodToGo .e-onboarding__card-image {
4325 - max-width: calc(100vw - 100px);
4326 -}
4327 -.e-onboarding__content:has(.e-onboarding__cards-grid--good-to-go-variant-b) .e-onboarding__page-content-section-title {
4328 - max-width: 440px;
4329 - justify-self: center;
4330 -}
4331 3795 .e-onboarding__good-to-go-footer {
4332 3796 justify-content: end;
4333 3797 }
4334 3798
4335 -.experiment401-variant-b .e-onboarding__cards-grid {
4336 - flex-wrap: nowrap;
4337 - row-gap: 24px;
4338 -}
4339 -.experiment401-variant-b .e-onboarding__card-image {
4340 - height: 112px;
4341 - width: auto;
4342 -}
4343 -.experiment401-variant-b .e-onboarding__switch-method-text {
4344 - color: #3A3F45;
4345 - text-align: center;
4346 - font-family: "DM Sans";
4347 - font-size: 18px;
4348 - font-weight: 700;
4349 - line-height: 150%;
4350 - letter-spacing: -0.18px;
4351 -}
4352 -.experiment401-variant-b .e-onboarding__progress-bar {
4353 - margin-block-end: 85px;
4354 -}
4355 -.experiment401-variant-b .e-onboarding__good-to-go-footer {
4356 - justify-content: center;
4357 -}
4358 -
4359 -.experiment402-variant-b .e-onboarding__page-content {
4360 - margin-block-end: 60px;
4361 -}
4362 -.experiment402-variant-b .e-onboarding__page-content-section-title {
4363 - margin-block-end: 0px;
4364 -}
4365 -.experiment402-variant-b .e-onboarding__page-content-section-title, .experiment402-variant-b .e-onboarding__card-text {
4366 - line-height: 1.3;
4367 -}
4368 -.experiment402-variant-b .e-onboarding__progress-bar {
4369 - margin-block-end: 85px;
4370 -}
4371 -
4372 -.experiment401-variant-b .e-onboarding__page-content-section-title {
4373 - margin-block-end: 0px;
4374 -}
4375 -.experiment401-variant-b .e-onboarding__page-content-section-title, .experiment401-variant-b .e-onboarding__card-text {
4376 - line-height: 1.3;
4377 -}
4378 -.experiment401-variant-b .e-onboarding__card-image {
4379 - margin-block-end: 32px;
4380 -}
4381 -.experiment401-variant-b .e-onboarding__card-text-small {
4382 - margin-block-start: 4px;
4383 -}
4384 -
4385 -@media screen and (min-width: 1024px) {
4386 - .experiment401-variant-b .e-onboarding__button-skip {
4387 - position: absolute;
4388 - inset-inline-end: 0px;
4389 - }
4390 -}
4391 -@media screen and (max-width: 1300px) {
4392 - .e-onboarding__page-goodToGo .e-onboarding__cards-grid {
4393 - flex-wrap: wrap;
4394 - }
4395 -}
4396 -@media screen and (max-width: 1024px) {
4397 - .experiment401-variant-b .e-onboarding__good-to-go-footer {
4398 - flex-direction: column;
4399 - gap: 60px;
4400 - }
4401 -}
4402 -@media screen and (max-width: 768px) {
4403 - .e-onboarding__page-goodToGo .e-onboarding__card {
4404 - padding-inline: 24px;
4405 - }
4406 - .experiment401-variant-b .e-onboarding__good-to-go-footer {
4407 - gap: 60px;
4408 - }
4409 -}
4410 -@media screen and (max-width: 500px) {
4411 - .e-onboarding__page-goodToGo .e-onboarding__card {
4412 - max-width: calc(100vw - 50px);
4413 - }
4414 -}
4415 3799 .e-onboarding__upload-pro {
4416 3800 flex-direction: row;
4417 3801 justify-content: center;
4418 3802 font-family: "DM Sans", "Roboto", sans-serif;
@@ -4490,348 +3874,7 @@
4490 3874 min-height: 55px;
4491 3875 margin-block-end: 20px;
4492 3876 }
4493 3877 .e-onboarding__page-chooseFeatures .e-onboarding__page-content {
4494 - margin-block-end: 0;
4495 -}
4496 -
4497 -.e-onboarding101-variant-b .e-app__footer,
4498 -.e-onboarding101-variant-b .e-onboarding__steps,
4499 -.e-onboarding101-variant-b .e-onboarding__skip-button,
4500 -.e-onboarding101-variant-b .e-onboarding__progress-bar {
4501 - display: none !important;
4502 -}
4503 -.e-onboarding101-variant-b .e-app__header {
4504 - position: fixed;
4505 - top: 0;
4506 - left: 0;
4507 - right: 0;
4508 - z-index: 1000;
4509 - background: white;
4510 - box-shadow: 0px 4px 6px 0px rgba(0, 0, 0, 0.04);
4511 -}
4512 -.e-onboarding101-variant-b .e-app__content {
4513 - height: 100vh;
4514 - display: flex;
4515 - align-items: center;
4516 - justify-content: center;
4517 - padding: 0;
4518 -}
4519 -.e-onboarding101-variant-b .e-onboarding__content {
4520 - display: flex;
4521 - padding-block-start: 150px;
4522 -}
4523 -.e-onboarding101-variant-b .e-onboarding__page-content {
4524 - max-width: 700px;
4525 - width: 700px;
4526 - text-align: center;
4527 - padding: 0;
4528 - margin: 0 auto;
4529 -}
4530 -.e-onboarding101-variant-b .e-onboarding101-variant-b-content-layout .e-onboarding__image,
4531 -.e-onboarding101-variant-b .e-onboarding101-variant-b-content-layout .e-onboarding__action-button,
4532 -.e-onboarding101-variant-b .e-onboarding101-variant-b-content-layout .e-onboarding__skip-button {
4533 - display: none;
4534 -}
4535 -.e-onboarding101-variant-b .e-onboarding__footer {
4536 - justify-content: center;
4537 - padding-block-end: 40px;
4538 -}
4539 -
4540 -.e-onboarding101-variant-b-content {
4541 - display: flex;
4542 - flex-direction: column;
4543 - align-items: center;
4544 - gap: 0px;
4545 - font-family: "DM Sans", sans-serif;
4546 - width: 700px;
4547 - margin: 0 auto;
4548 -}
4549 -.e-onboarding101-variant-b-content .e-onboarding101-variant-b-icon {
4550 - margin-bottom: 28px;
4551 -}
4552 -.e-onboarding101-variant-b-content .e-onboarding101-variant-b-icon svg {
4553 - width: 104px;
4554 - height: 104px;
4555 -}
4556 -.e-onboarding101-variant-b-content .e-onboarding101-variant-b-title {
4557 - font-family: "Source Serif Pro", serif;
4558 - font-weight: 700;
4559 - font-size: 48px;
4560 - line-height: 1.3;
4561 - color: #0c0d0e;
4562 - margin: 0 0 10px 0;
4563 - width: 100%;
4564 - text-align: center;
4565 -}
4566 -.e-onboarding101-variant-b-content .e-onboarding101-variant-b-description {
4567 - font-family: "DM Sans", sans-serif;
4568 - font-size: 18px;
4569 - font-weight: 400;
4570 - line-height: 1.5;
4571 - color: #3a3f45;
4572 - letter-spacing: -0.18px;
4573 - margin: 0 0 40px 0;
4574 - width: 100%;
4575 - max-width: 600px;
4576 - text-align: center;
4577 -}
4578 -.e-onboarding101-variant-b-content .e-onboarding101-variant-b-welcome {
4579 - margin-block-end: 5px;
4580 -}
4581 -.e-onboarding101-variant-b-content .e-onboarding101-variant-b-buttons {
4582 - display: flex;
4583 - flex-direction: column;
4584 - gap: 8px;
4585 - width: 264px;
4586 - align-items: center;
4587 - margin-top: 20px;
4588 -}
4589 -.e-onboarding101-variant-b-content .e-onboarding101-variant-b-button {
4590 - display: flex;
4591 - align-items: center;
4592 - justify-content: center;
4593 - height: 48px;
4594 - padding: 14px 16px;
4595 - border-radius: 0;
4596 - border: none;
4597 - font-family: "DM Sans", sans-serif;
4598 - font-weight: 500;
4599 - font-size: 18px;
4600 - line-height: 1;
4601 - letter-spacing: 0.18px;
4602 - cursor: pointer;
4603 - transition: all 0.2s ease;
4604 - white-space: nowrap;
4605 - width: 100%;
4606 - text-decoration: none;
4607 - box-sizing: border-box;
4608 -}
4609 -.e-onboarding101-variant-b-content .e-onboarding101-variant-b-button--primary {
4610 - background: #f3bafd;
4611 - color: #0c0d0e;
4612 -}
4613 -.e-onboarding101-variant-b-content .e-onboarding101-variant-b-button--primary:hover {
4614 - background: #e8a5f8;
4615 -}
4616 -.e-onboarding101-variant-b-content .e-onboarding101-variant-b-button--primary:active {
4617 - background: #dd90f3;
4618 -}
4619 -.e-onboarding101-variant-b-content .e-onboarding101-variant-b-button--secondary {
4620 - background: transparent;
4621 - color: #6a727c;
4622 - text-decoration: underline;
4623 - text-underline-position: from-font;
4624 -}
4625 -.e-onboarding101-variant-b-content .e-onboarding101-variant-b-button--secondary:hover {
4626 - color: #232629;
4627 -}
4628 -.e-onboarding101-variant-b-content .e-onboarding101-variant-b-button--secondary:active {
4629 - color: #0c0d0e;
4630 -}
4631 -
4632 -@media screen and (min-width: 1024px) {
4633 - .e-onboarding101-variant-b .e-onboarding__content {
4634 - min-height: 600px;
4635 - }
4636 -}
4637 -@media screen and (max-width: 768px) {
4638 - .e-onboarding101-variant-b .e-onboarding__page-content {
4639 - padding: 20px;
4640 - width: calc(100% - 40px);
4641 - max-width: 700px;
4642 - }
4643 - .e-onboarding101-variant-b .e-onboarding101-variant-b-content {
4644 - width: 100%;
4645 - }
4646 - .e-onboarding101-variant-b .e-onboarding101-variant-b-title {
4647 - font-size: 36px;
4648 - }
4649 - .e-onboarding101-variant-b .e-onboarding101-variant-b-buttons {
4650 - width: 100%;
4651 - max-width: 300px;
4652 - }
4653 -}
4654 -@media screen and (max-width: 480px) {
4655 - .e-onboarding101-variant-b .e-onboarding__page-content {
4656 - padding: 15px;
4657 - width: calc(100% - 30px);
4658 - }
4659 - .e-onboarding101-variant-b .e-onboarding__content {
4660 - padding-block-start: 5rem;
4661 - }
4662 - .e-onboarding101-variant-b .e-onboarding101-variant-b-content {
4663 - width: 100%;
4664 - }
4665 - .e-onboarding101-variant-b .e-onboarding101-variant-b-title {
4666 - font-size: 28px;
4667 - }
4668 - .e-onboarding101-variant-b .e-onboarding101-variant-b-description {
4669 - font-size: 16px;
4670 - }
4671 - .e-onboarding101-variant-b .e-onboarding101-variant-b-buttons {
4672 - width: 100%;
4673 - }
4674 -}
4675 -.experiment202-variant-b .e-onboarding__progress-bar {
4676 - margin-block-end: 85px;
4677 -}
4678 -.experiment202-variant-b .e-onboarding__page-content--experiment-202 {
4679 - display: flex;
4680 - flex-direction: column;
4681 - align-items: center;
4682 - text-align: center;
4683 - max-width: 1000px;
4684 - margin: 0 auto;
4685 - padding: 0 20px;
4686 -}
4687 -.experiment202-variant-b .e-onboarding__page-content-header {
4688 - margin-block-end: 48px;
4689 -}
4690 -.experiment202-variant-b .e-onboarding__page-content-title {
4691 - font-family: "Source Serif Pro", serif;
4692 - font-weight: 700;
4693 - font-size: 36px;
4694 - line-height: 1.3;
4695 - color: #0C0D0E;
4696 - margin: 0 0 10px 0;
4697 -}
4698 -.experiment202-variant-b .e-onboarding__page-content-subtitle {
4699 - font-family: "DM Sans", sans-serif;
4700 - font-weight: 400;
4701 - font-size: 18px;
4702 - line-height: 1.5;
4703 - color: #3A3F45;
4704 - letter-spacing: -0.18px;
4705 - margin: 0;
4706 -}
4707 -.experiment202-variant-b .e-onboarding__features-grid {
4708 - display: flex;
4709 - justify-content: center;
4710 - flex-wrap: wrap;
4711 - gap: 60px;
4712 - width: 100%;
4713 - padding-block-end: 150px;
4714 - min-height: 280px;
4715 -}
4716 -.experiment202-variant-b .e-onboarding__feature-item {
4717 - display: flex;
4718 - flex-direction: column;
4719 - align-items: center;
4720 - text-align: center;
4721 - gap: 8px;
4722 - max-width: 280px;
4723 -}
4724 -.experiment202-variant-b .e-onboarding__feature-item:last-of-type .e-onboarding__feature-description {
4725 - max-width: 210px;
4726 -}
4727 -.experiment202-variant-b .e-onboarding__feature-icon {
4728 - display: flex;
4729 - align-items: center;
4730 - justify-content: center;
4731 - width: 35px;
4732 - height: 35px;
4733 - margin-block-end: 8px;
4734 -}
4735 -.experiment202-variant-b .e-onboarding__feature-icon svg {
4736 - width: 35px;
4737 - height: 35px;
4738 - flex-shrink: 0;
4739 -}
4740 -.experiment202-variant-b .e-onboarding__feature-content {
4741 - display: flex;
4742 - flex-direction: column;
4743 - align-items: center;
4744 - gap: 8px;
4745 -}
4746 -.experiment202-variant-b .e-onboarding__feature-title {
4747 - font-family: "DM Sans", sans-serif;
4748 - font-weight: 600;
4749 - font-size: 20px;
4750 - line-height: 1.5;
4751 - color: #3A3F45;
4752 - letter-spacing: -0.2px;
4753 - margin: 0;
4754 -}
4755 -.experiment202-variant-b .e-onboarding__feature-description {
4756 - font-family: "DM Sans", sans-serif;
4757 - font-weight: 400;
4758 - font-size: 14px;
4759 - line-height: 1.5;
4760 - color: #3A3F45;
4761 - letter-spacing: -0.14px;
4762 - margin: 0;
4763 - max-width: 260px;
4764 -}
4765 -.experiment202-variant-b .e-onboarding__theme-switch-note {
4766 - font-family: "DM Sans", sans-serif;
4767 - font-weight: 600;
4768 - font-size: 14px;
4769 - line-height: 1.5;
4770 - color: #3A3F45;
4771 - letter-spacing: -0.14px;
4772 - margin: 24px 0 0 0;
4773 -}
4774 -.experiment202-variant-b .e-onboarding__footer {
4775 - display: flex;
4776 - justify-content: center;
4777 -}
4778 -.experiment202-variant-b .e-onboarding__footnote {
4779 - display: flex;
4780 - justify-content: center;
4781 - width: 100%;
4782 - color: #3A3F45;
4783 - text-align: center;
4784 - font-family: "DM Sans";
4785 - font-size: 14px;
4786 - font-weight: 600;
4787 - line-height: 150%;
4788 - letter-spacing: -0.14px;
4789 - margin-block: 24px 60px;
4790 -}
4791 -.experiment202-variant-b .e-onboarding__footnote::before {
4792 - content: initial;
4793 -}
4794 -.experiment202-variant-b .e-onboarding__notice {
4795 - display: flex;
4796 - justify-content: center;
4797 -}
4798 -
4799 -@media screen and (min-width: 769px) {
4800 - .experiment202-variant-b .e-onboarding__button-skip {
4801 - position: absolute;
4802 - inset-inline-end: 30px;
4803 - }
4804 -}
4805 -@media screen and (max-width: 768px) {
4806 - .experiment202-variant-b .e-onboarding__page-content--experiment-202 {
4807 - padding: 0 16px;
4808 - }
4809 - .experiment202-variant-b .e-onboarding__page-content-title {
4810 - font-size: 28px;
4811 - }
4812 - .experiment202-variant-b .e-onboarding__features-grid {
4813 - grid-template-columns: 1fr;
4814 - gap: 40px;
4815 - padding-block-end: 60px;
4816 - }
4817 - .experiment202-variant-b .e-onboarding__feature-title {
4818 - font-size: 18px;
4819 - white-space: normal;
4820 - }
4821 - .experiment202-variant-b .e-onboarding__feature-description {
4822 - max-width: 100%;
4823 - }
4824 -}
4825 -@media (max-width: 1024px) and (min-width: 769px) {
4826 - .experiment202-variant-b .e-onboarding__features-grid {
4827 - display: flex;
4828 - flex-wrap: wrap;
4829 - justify-content: center;
4830 - gap: 40px 60px;
4831 - padding-block-end: 60px;
4832 - }
4833 - .experiment202-variant-b .e-onboarding__feature-description {
4834 - max-width: 220px;
4835 - }
3878 + margin-bottom: 0;
4836 3879 }
4837 3880 /*# sourceMappingURL=app-rtl.css.map */