PluginProbe
MainWP Dashboard: Self-hosted WordPress Management for Agencies / 6.2.2
MainWP Dashboard: Self-hosted WordPress Management for Agencies v6.2.2
6.2.2 6.2.1 6.2 6.1.8 6.1.7 6.1.6 6.1.5 6.1.4 6.1.3 6.1.2 6.1.1 6.1 6.0.12 6.0.11 4.6.0.1 5.0 5.0.1 5.0.2 5.0.3 5.0.3.1 5.0.3.2 5.1 5.1.1 5.2 5.2.1 All 155 releases
← All changes | assets/css/themes/mainwp-default-theme.css +1867 -349 5.0.2 → 6.2.2 View file →
@@ -1,469 +1,989 @@
1 1 /*******************************
2 2 Variables
3 3 *******************************/
4 4 :root {
5 - --font-color: #34424D;
6 - --font-color-light: #999999;
7 - --link-color: #4682b4;
8 - --heading-color: #2D3B44;
9 - --accent: #4682b4;
10 - --blue-light: #4682b4;
11 - --blue-dark: #0253B3;
12 - --green-color: #7fb100;
13 - --red-color: #AD0000;
14 - --yellow-color: #FFD300;
15 - --grey-light: #F1F6FA;
16 - --grey-light-alt: #E7EEF6;
17 - --grey-dark: #2D3B44;
18 - --grey-dark-alt: #3a4c58;
19 - --grey-darker: #445461;
20 - --grey-darker-alt: #575759;
5 + /* Text Colors */
6 + --mainwp-text: #2f3437;
7 + --mainwp-text-secondary: #73777b;
8 + --mainwp-text-disabled: #a8adb3;
9 + --mainwp-text-header: #202427;
10 + --mainwp-link-color: #357da8;
11 +/* General Colors */
12 + --mainwp-green: #6c9800;
13 + --mainwp-blue: #3f83ad;
14 + --mainwp-red: #b94141;
15 + --mainwp-yellow: #d7b33e;
16 + --mainwp-orange: #b86a2d;
17 + /* Background Colors */
18 + --mainwp-base-background: #ffffff;
19 + --mainwp-base-background-secondary: #fafafa;
20 + --mainwp-element-background: #ffffff;
21 + --mainwp-element-background-secondary: #fbfbfc;
22 + --mainwp-tab-bar-background: #f7f7f9;
23 + --mainwp-shell-background: #f3f3f4;
24 + --mainwp-shell-background-hover: #eaeaec;
25 + /* Border Colors */
26 + --mainwp-border: #e8e8eb;
27 + --mainwp-border-medium: #dedee3;
28 + --mainwp-border-strong: #cfcfd6;
29 + --button-radius: 5rem;
30 + --input-radius: 5px;
31 + --label-radius: 5px;
32 + --area-radius: 1rem;
33 + --mainwp-area-padding: 1.25rem;
21 34 }
35 +.mainwp-ui.mainwp-custom-theme .ui.double.loader::after {
36 + display: none !important;
37 +}
38 +.mainwp-ui.mainwp-custom-theme .ui.double.loader::before {
39 + content: '';
40 + display: inline-block;
41 + width: 2.28571429em;
42 + height: 2.28571429em;
43 + border: none !important;
44 + background-image: url('data:image/svg+xml;utf8,<svg viewBox="0 0 170 170" xmlns="http://www.w3.org/2000/svg"><circle fill="%237FB100" cx="85" cy="85" r="78.67"/><circle fill="%23FFFFFF" cx="85" cy="37.8" r="15.73"/><polygon fill="%23FFFFFF" points="111.75,132.2 85,147.94 58.25,132.2 85,22.06"/></svg>');
45 + background-size: contain;
46 + background-repeat: no-repeat;
47 + animation: pulse 1.25s ease-in-out infinite;
48 +}
22 49
50 +@keyframes pulse {
51 + 0%, 100% { transform: scale(1); opacity: 1; }
52 + 50% { transform: scale(1.3); opacity: 0.99; }
53 +}
54 +
55 +
23 56 .mainwp-ui.mainwp-custom-theme #mainwp-all-active-plugins-table i.circular.icon.cached-icon-customable,
24 -.mainwp-ui.mainwp-custom-theme #mainwp-globally-ignored-plugins i.circular.icon.cached-icon-customable,
25 -.mainwp-ui.mainwp-custom-theme #mainwp-manage-sites-monitor-table i.circular.icon {
26 - height: 1em !important;
57 +.mainwp-ui.mainwp-custom-theme #mainwp-globally-ignored-plugins i.circular.icon.cached-icon-customable{
58 + min-height: 1em !important;
27 59 }
28 60
61 +/* Quick Setup Wizard
62 + ========================================================================== */
63 +
64 +.mainwp-ui.mainwp-custom-theme.mainwp-ui-setup .mainwp-quick-setup-wizard-steps-content .ui.segment {
65 + background: none !important;
66 +}
67 +.mainwp-ui.mainwp-custom-theme.mainwp-ui-setup .mainwp-quick-setup-wizard-steps-content #mainwp-connection-authentication-accordion {
68 + background: var(--mainwp-border) !important;
69 +}
70 +.mainwp-ui.mainwp-custom-theme.mainwp-ui-setup .mainwp-quick-setup-wizard-steps-content #mainwp-add-sites-info-accordion,
71 +.mainwp-ui.mainwp-custom-theme.mainwp-ui-setup .mainwp-quick-setup-wizard-steps-content #mainwp-add-sites-info-accordion .title,
72 +.mainwp-ui.mainwp-custom-theme.mainwp-ui-setup .mainwp-quick-setup-wizard-steps-content #mainwp-add-sites-info-accordion .content {
73 + background: var(--mainwp-border) !important;
74 +}
75 +
29 76 /* General styles
30 77 ========================================================================== */
31 78
32 -.mainwp-ui.mainwp-custom-theme a:not( .button, .title, .uf-fmuci-button-main ) {
33 - color: var( --link-color ) !important;
34 - font-weight: 700;
79 +.mainwp-ui.mainwp-custom-theme a:not(.button, .title, .uf-fmuci-button-main, .grey ) {
80 + color: var(--mainwp-link-color);
81 + font-weight: 600;
35 82 }
36 83
37 -.mainwp-ui.mainwp-custom-theme a:not( .button ) .icon:not( .green, .red ),
84 +.mainwp-ui.mainwp-custom-theme.mainwp-default-theme a:not(.button).grey {
85 + color: var(--mainwp-text-secondary) !important;
86 +}
87 +.mainwp-ui.mainwp-custom-theme a:not(.button).green {
88 + color: var(--mainwp-green) !important;
89 +}
90 +
91 +.mainwp-ui.mainwp-custom-theme a:not(.button) .icon:not(.green, .red, .yellow, .custom-icon),
38 92 .mainwp-ui.mainwp-custom-theme .statistic a {
39 - color: var( --link-color ) !important;
40 - font-weight: normal !important;
41 - text-decoration: none !important;
93 + color: var(--mainwp-link-color);
94 + font-weight: normal !important;
95 + text-decoration: none !important;
42 96 }
43 97
44 98 .mainwp-ui.mainwp-custom-theme .menu a {
45 - text-decoration: none !important;
99 + text-decoration: none !important;
46 100 }
47 101
102 +.mainwp-ui.mainwp-custom-theme table.dataTable.table > tbody > tr.selected a:not(.button, .title, .uf-fmuci-button-main, .grey ) {
103 + color: var(--mainwp-link-color);
104 + font-weight: 600;
105 +}
106 +
107 +.mainwp-ui.mainwp-custom-theme h3,
48 108 .mainwp-ui.mainwp-custom-theme .header {
49 - color: var( --font-color );
109 + color: var(--mainwp-text-header);
110 + font-weight: 600;
50 111 }
51 112
52 113 .mainwp-ui.mainwp-custom-theme .header .sub.header {
53 - font-style: italic;
54 - color: var( --font-color-light );
114 + color: var(--mainwp-text-secondary);
55 115 }
56 116
57 -.mainwp-ui.mainwp-custom-theme .ui.divider:not(.vertical):not(.horizontal) {
58 - border-color: var( --grey-light-alt );
117 +.mainwp-ui.mainwp-custom-theme .ui.dividing.header {
118 + border-bottom: 1px solid var(--mainwp-border) !important;
59 119 }
60 120
61 -.mainwp-ui.mainwp-custom-theme .ui.statistics .statistic > .value,
62 -.mainwp-ui.mainwp-custom-theme .ui.statistic > .value {
63 - color: var( --font-color );
121 +.mainwp-ui.mainwp-custom-theme .ui.statistics .statistic .label,
122 +.mainwp-ui.mainwp-custom-theme .ui.statistic .label {
123 + color: var(--mainwp-text-secondary);
64 124 }
125 +.mainwp-ui.mainwp-custom-theme .ui.statistics .statistic .value,
126 +.mainwp-ui.mainwp-custom-theme .ui.statistic .value {
127 + color: var(--mainwp-text);
128 +}
65 129
130 +/* Divider */
131 +
132 +.mainwp-ui .ui.divider {
133 + color: var(--mainwp-text-secondary) !important;
134 +}
135 +
66 136 /* Buttons */
67 137
68 138 .mainwp-ui.mainwp-custom-theme .ui.button {
69 - border-radius: 15px;
70 - -webkit-border-radius: 15px;
71 - box-shadow: 0 1px 2px 0 rgba( 0, 0, 0, .15 ) !important;
139 + border-radius: var(--button-radius) !important;
140 + -webkit-border-radius: var(--button-radius) !important;
141 + box-shadow: none !important;
142 + transition: filter 0.1s ease-in-out;
72 143 }
73 144
74 -.mainwp-ui.mainwp-custom-theme .ui.button:hover {
75 - box-shadow: 0 1px 2px 0 rgba( 0, 0, 0, .0 ) !important;
145 +.mainwp-ui.mainwp-custom-theme .ui.button:not( .mini, .tiny, .small ) {
146 + font-weight: 600 !important;
76 147 }
77 148
78 -.mainwp-ui.mainwp-custom-theme .ui.tiny.button {
79 - border-radius: 10px;
80 - -webkit-border-radius: 10px;
149 +.mainwp-ui.mainwp-custom-theme .ui.button:hover {
150 + box-shadow: none !important;
81 151 }
82 152
83 -.mainwp-ui.mainwp-custom-theme .ui.mini.button {
84 - border-radius: 8px;
85 - -webkit-border-radius: 8px;
153 +.mainwp-ui.mainwp-custom-theme #mainwp-top-header .ui.dropdown.button {
154 + margin-right: 0px;
86 155 }
87 156
88 -.mainwp-ui.mainwp-custom-theme #mainwp-add-new-buttons .ui.button:nth-of-type(2) {
89 - border-radius: 15px 0px 0px 15px !important;
90 -}
91 -
92 157 .mainwp-ui.mainwp-custom-theme .ui.buttons .ui.button {
93 - border-radius: 0px !important;
158 + border-radius: 0px !important;
159 + -webkit-border-radius: 0px !important;
94 160 }
95 161
96 162 .mainwp-ui.mainwp-custom-theme .ui.buttons .button:first-child {
97 - border-radius: 15px 0px 0px 15px !important;
163 + border-radius: var(--button-radius) 0px 0px var(--button-radius) !important;
164 + -webkit-border-radius: var(--button-radius) 0px 0px var(--button-radius) !important;
98 165 }
99 166
100 167 .mainwp-ui.mainwp-custom-theme .ui.buttons .button:last-child {
101 - border-radius: 0px 15px 15px 0px !important;
168 + border-radius: 0px var(--button-radius) var(--button-radius) 0px !important;
169 + -webkit-border-radius: 0px var(--button-radius) var(--button-radius) 0px !important;
102 170 }
103 171
104 -.mainwp-ui.mainwp-custom-theme .ui.mini.buttons .button:first-child {
105 - border-radius: 8px 0px 0px 8px !important;
172 +.mainwp-ui.mainwp-custom-theme .ui.buttons .ui.disabled.basic.button {
173 + background-color: var(--mainwp-element-background) !important;
174 + color: var(--mainwp-text-secondary) !important;
106 175 }
107 176
108 -.mainwp-ui.mainwp-custom-theme .ui.mini.buttons .button:last-child {
109 - border-radius: 0px 8px 8px 0px !important;
110 -}
177 +.mainwp-ui.mainwp-custom-theme .ui.button:not(.green, .basic, .disabled, .red, .blue, .black),
178 +.mainwp-ui.mainwp-custom-theme .ui.basic.button:not(.green, .disabled, .red, .blue, .black) {
179 + background-color: var(--mainwp-element-background) !important;
180 + border: 1px solid var(--mainwp-border) !important;
181 + color: var(--mainwp-text);
111 182
112 -.mainwp-ui.mainwp-custom-theme .ui.button:not( .green, .basic, .disabled, .red, .blue, .black ),
113 -.mainwp-ui.mainwp-custom-theme .ui.basic.button:not( .green, .disabled, .red, .blue, .black ) {
114 - background-color: var( --grey-light-alt ) !important;
115 - border: none !important;
116 - color: var( --grey-dark-alt );
117 - font-weight: normal;
118 183 }
119 184
120 185 .mainwp-ui.mainwp-custom-theme .ui.black.button {
121 - background: var( --grey-dark-alt ) !important;
122 - color: var( --grey-light ) !important;
186 + background: var(--mainwp-text-header) !important;
187 + color: var(--mainwp-element-background) !important;
123 188 }
124 189
125 190 .mainwp-ui.mainwp-custom-theme .ui.black.button .icon {
126 - color: var( --grey-light ) !important;
191 + color: var(--mainwp-element-background) !important;
127 192 }
128 193
129 -.mainwp-ui.mainwp-custom-theme .ui.button.green:not( .basic, .disabled ) {
130 - background-color: var( --accent );
131 - color: #fff;
194 +.mainwp-ui.mainwp-custom-theme .ui.button.green:not(.basic, .disabled) {
195 + background-color: var(--mainwp-blue);
196 + color: #ffffff !important;
132 197 border: none;
133 198 }
134 199
135 -.mainwp-ui.mainwp-custom-theme .ui.button.green.basic:not( .pointing ) {
136 - background-color: var( --green-color ) !important;
200 +.mainwp-ui.mainwp-custom-theme .ui.button.green.basic:not(.pointing) {
201 + background-color: var(--mainwp-green) !important;
137 202 border: none;
138 203 color: #ffffff !important;
139 204 }
140 205
141 206 .mainwp-ui.mainwp-custom-theme .ui.button.green.basic.pointing {
142 - background-color: var( --grey-light ) !important;
143 - border: 1px solid var( --grey-light-alt ) !important;
144 - color: var( --font-color ) !important;
207 + background-color: var(--mainwp-base-background) !important;
208 + border: 1px solid var(--mainwp-border) !important;
209 + color: var(--mainwp-text) !important;
145 210 }
146 211
147 212 .mainwp-ui.mainwp-custom-theme .ui.button.red {
148 - background-color: var(--red-color);
213 + background-color: var(--mainwp-red);
214 + color: #ffffff !important;
149 215 }
150 216
151 217 .mainwp-ui.mainwp-custom-theme .ui.basic.button.red {
152 - background-color: var(--red-color);
153 - color: #fff;
218 + background-color: var(--mainwp-element-background) !important;
219 + border: 1px solid var(--mainwp-red) !important;
220 + color: var(--mainwp-red) !important;
154 221 }
155 222
223 +.mainwp-ui.mainwp-custom-theme .ui.button.orange {
224 + background-color: var(--mainwp-orange) !important;
225 + color: #ffffff !important;
226 +}
227 +
228 +.mainwp-ui.mainwp-custom-theme .ui.basic.orange.button {
229 + background-color: var(--mainwp-base-background) !important;
230 + border: 1px solid var(--mainwp-orange) !important;
231 + color: var(--mainwp-orange) !important;
232 +}
233 +
234 +.mainwp-ui.mainwp-custom-theme .ui.button.yellow {
235 + background-color: var(--mainwp-yellow) !important;
236 + color: var(--mainwp-text-header) !important;
237 +}
238 +
156 239 .mainwp-ui.mainwp-custom-theme .ui.basic.yellow.button {
157 - background-color: var( --yellow-color ) !important;
158 - color: #fff;
240 + background-color: var(--mainwp-base-background) !important;
241 + border: 1px solid var(--mainwp-yellow) !important;
242 + color: var(--mainwp-yellow) !important;
159 243 }
160 244
245 +.mainwp-ui.mainwp-custom-theme .ui.labeled.button {
246 + border: none !important;
247 +}
248 +.mainwp-ui.mainwp-custom-theme .ui.labeled.button .ui.button {
249 + border-radius: 0 var(--button-radius) var(--button-radius) 0 !important;
250 + -webkit-border-radius: 0 var(--button-radius) var(--button-radius) 0 !important;
251 +}
252 +.mainwp-ui.mainwp-custom-theme .ui.labeled.button .ui.basic.label {
253 + border-radius: var(--button-radius) 0 0 var(--button-radius) !important;
254 + -webkit-border-radius: var(--button-radius) 0 0 var(--button-radius) !important;
255 +}
256 +
257 +.mainwp-ui.mainwp-custom-theme .ui.disabled.button {
258 + background-color: var(--mainwp-element-background) !important;
259 + color: var(--mainwp-text-secondary) !important;
260 +}
261 +
161 262 /* Labels */
162 263
163 -.mainwp-ui.mainwp-custom-theme .ui.red.label:not( .basic, .corner ) {
164 - background-color: var( --red-color ) !important;
264 +.mainwp-ui.mainwp-custom-theme .ui.label:not(.green, .disabled, .red) {
265 + background-color: var(--mainwp-element-background);
266 + border: 1px solid var(--mainwp-border);
267 + color: var(--mainwp-text);
268 + box-shadow: none;
269 + -webkit-box-shadow: none;
165 270 }
166 271
167 -.mainwp-ui.mainwp-custom-theme .ui.yellow.label:not( .basic, .corner ) {
168 - background-color: var( --yellow-color ) !important;
272 +.mainwp-ui.mainwp-custom-theme .ui.basic.label {
273 + background: none !important;
169 274 }
170 275
171 -.mainwp-ui.mainwp-custom-theme .ui.blue.label:not( .basic, .corner ) {
172 - background-color: var( --blue-light ) !important;
173 - color: #fff;
276 +.mainwp-ui.mainwp-custom-theme .ui.red.label:not(.basic, .corner) {
277 + background-color: var(--mainwp-red) !important;
174 278 }
175 279
280 +.mainwp-ui.mainwp-custom-theme .ui.yellow.label:not(.basic, .corner) {
281 + background-color: var(--mainwp-yellow) !important;
282 + color: var(--mainwp-text-header);
283 +}
284 +
285 +.mainwp-ui.mainwp-custom-theme .ui.orange.label:not(.basic, .corner) {
286 + background-color: var(--mainwp-orange) !important;
287 + color: #ffffff !important;
288 +}
289 +
290 +.mainwp-ui.mainwp-custom-theme .ui.blue.label:not(.basic, .corner) {
291 + background-color: var(--mainwp-blue) !important;
292 + color: #ffffff;
293 +}
294 +
176 295 .mainwp-ui.mainwp-custom-theme .ui.tag.label {
177 - background-color: var( --grey-light-alt );
296 + background-color: var(--mainwp-element-background-secondary);
178 297 }
179 298
180 299 .mainwp-ui.mainwp-custom-theme .ui.dropdown .ui.label {
181 - border-radius: 10px;
182 - -webkit-border-radius: 10px;
183 - background-color: var( --grey-light-alt );
184 - border-color: var( --grey-light );
300 + border-radius: var(--label-radius);
301 + -webkit-border-radius: var(--label-radius);
302 + background-color: var(--mainwp-element-background-secondary);
303 + border-color: var(--mainwp-border);
185 304 }
186 305
187 306 .mainwp-ui.mainwp-custom-theme .card .ui.corner.green.label:after {
188 - color: #7fb100 !important;
307 + color: var(--mainwp-green) !important;
189 308 }
309 +
190 310 .mainwp-ui.mainwp-custom-theme .card .ui.red.corner.label:after {
191 - color: var( --red-color ) !important;
311 + color: var(--mainwp-red) !important;
192 312 }
313 +
193 314 .mainwp-ui.mainwp-custom-theme .card .ui.yellow.corner.label:after {
194 - color: var( --yellow-color ) !important;
315 + color: var(--mainwp-yellow) !important;
195 316 }
196 317
197 318 .mainwp-ui.mainwp-custom-theme a.label:not(.tag, .transition, .basic) {
198 - color: #ffffff !important;
319 + color: var(--mainwp-text) !important;
199 320 }
200 321
201 322 .mainwp-ui.mainwp-custom-theme .ui.multiple.selection.dropdown a.label,
202 323 .mainwp-ui.mainwp-custom-theme .ui.multiple.selection.dropdown .icon {
203 - color: var( --font-color ) !important;
324 + color: var(--mainwp-text) !important;
204 325 }
205 326
206 -.mainwp-ui.mainwp-custom-theme .ui.label:not(.tag, .transition) .icon {
207 - color: #ffffff !important;
327 +.mainwp-ui.mainwp-custom-theme .ui.label:not(.tag, .transition, .basic) .icon {
328 + color: var(--mainwp-text) !important;
208 329 }
209 330
210 331 /* Icons */
332 +.mainwp-ui.mainwp-custom-theme i.icon.inverted {
333 + color: var(--mainwp-text) !important;
334 +}
211 335
212 -.mainwp-ui.mainwp-custom-theme i.icon.inverted {
213 - color: #fff !important;
336 +.mainwp-ui.mainwp-custom-theme .mainwp_client_icon_display > i.circular.inverted.icon {
337 + color: #f3f4f6 !important;
214 338 }
215 339
216 340 .mainwp-ui.mainwp-custom-theme i.blue.icon.inverted {
217 - background-color: var( --accent ) !important;
218 - color: #fff !important;
341 + background-color: var(--mainwp-blue) !important;
219 342 }
220 -
343 +.mainwp-ui.mainwp-custom-theme i.red.icon {
344 + color: var(--mainwp-red) !important;
345 +}
221 346 .mainwp-ui.mainwp-custom-theme i.red.icon.inverted {
222 - background-color: var( --red-color ) !important;
347 + background-color: var(--mainwp-red) !important;
223 348 }
224 349
225 350 .mainwp-ui.mainwp-custom-theme i.yellow.icon.inverted {
226 - background-color: var( --yellow-color ) !important;
351 + background-color: var(--mainwp-yellow) !important;
227 352 }
228 353
229 354 .mainwp-ui.mainwp-custom-theme #mainwp-install-plugins-container .card .star.icon:hover,
230 355 .mainwp-ui.mainwp-custom-theme #mainwp-install-plugins-container .card .favorite .star.icon,
231 356 .mainwp-ui.mainwp-custom-theme .mainwp-browse-themes .card .favorite .star.icon {
232 - color: var( --yellow-color ) !important;
357 + color: var(--mainwp-yellow) !important;
233 358 }
234 359
360 +.mainwp-ui.mainwp-custom-theme .mainwp-content-wrap .ui.pointing.dropdown a {
361 + color: var(--mainwp-text) !important;
362 +}
363 +.mainwp-ui.mainwp-custom-theme .mainwp-content-wrap .ui.pointing.dropdown .icon {
364 + color: var(--mainwp-text) !important;
365 + padding-right: 0 !important;
366 +}
367 +
368 +.mainwp-ui.mainwp-custom-theme i.icons .corner.icon {
369 + text-shadow: -1px -1px 0 var(--mainwp-base-background), 1px -1px 0 var(--mainwp-base-background), -1px 1px 0 var(--mainwp-base-background), 1px 1px 0 var(--mainwp-base-background) !important
370 +}
371 +
372 +.mainwp-ui.mainwp-custom-theme .ui.grey.label:not(.tag, .transition) .icon.green {
373 + color: var(--mainwp-green) !important;
374 +}
375 +
376 +.mainwp-ui.mainwp-custom-theme .ui.grey.label:not(.tag, .transition) .icon.red {
377 + color: var(--mainwp-red) !important;
378 +}
379 +
235 380 /* Messages */
236 381
382 +.mainwp-ui.mainwp-custom-theme .ui.message.mainwp-welcome-message {
383 + border-radius: var(--area-radius) !important;
384 + margin-bottom: 0 !important;
385 +}
386 +
387 +.mainwp-ui.mainwp-custom-theme .ui.message.info a:not(.button) {
388 + color: var(--mainwp-link-color) !important;
389 +}
390 +
237 391 .mainwp-ui.mainwp-custom-theme .ui.message {
238 - background-color: #fafafa;
239 - color: var( --font-color );
240 - box-shadow: 0 1px 2px 0 rgba( 0, 0, 0, .1 ) !important;
241 - -webkit-box-shadow: 0 1px 2px 0 rgba( 0, 0, 0, .1 ) !important;
392 + background-color: var(--mainwp-element-background);
393 + border: 1px solid var(--mainwp-border);
394 + color: var(--mainwp-text);
395 + box-shadow: none !important;
396 + -webkit-box-shadow: none !important;
242 397 }
243 398
399 +.mainwp-ui.mainwp-custom-theme .ui.message .header {
400 + color: var(--mainwp-text-header);
401 +}
402 +
244 403 .mainwp-ui.mainwp-custom-theme .ui.info.message,
245 404 .mainwp-ui.mainwp-custom-theme .ui.blue.message {
246 - border-left: 48px solid var( --blue-light );
405 + background-color: #4682b410 !important;
406 + border: 1px solid var(--mainwp-blue) !important;
407 + color: var(--mainwp-text) !important;
408 + padding-left: 3rem;
247 409 }
248 410
249 411 .mainwp-ui.mainwp-custom-theme .ui.info.message:before,
250 412 .mainwp-ui.mainwp-custom-theme .ui.blue.message:before {
251 - content: "\f129";
252 - font-family: 'Icons';
253 - color: #ffffff;
254 - position: absolute;
255 - top: 14px;
256 - left: -26px;
413 + content: "\f129";
414 + font-family: 'Icons', sans-serif;
415 + color: var(--mainwp-blue) !important;
416 + position: absolute;
417 + top: 1rem;
418 + left: 1.5rem;
257 419 }
258 420
259 421 .mainwp-ui.mainwp-custom-theme .ui.info.mini.message:before,
260 422 .mainwp-ui.mainwp-custom-theme .ui.blue.mini.message:before {
261 - top: 11px;
423 + top: 0.9em;
262 424 }
263 425
264 426 .mainwp-ui.mainwp-custom-theme .ui.green.message {
265 - border-left: 48px solid var( --green-color );
427 + background-color: #6c980012 !important;
428 + border: 1px solid var(--mainwp-green) !important;
429 + color: var(--mainwp-text);
430 + padding-left: 3rem;
266 431 }
267 432
268 433 .mainwp-ui.mainwp-custom-theme .ui.green.message:before {
269 - content: "\f00c";
270 - font-family: 'Icons';
271 - color: #ffffff;
272 - position: absolute;
273 - top: 14px;
274 - left: -30px;
434 + content: "\f00c";
435 + font-family: 'Icons', sans-serif;
436 + color: var(--mainwp-green) !important;
437 + position: absolute;
438 + top: 1rem;
439 + left: 1.5rem;
275 440 }
276 441
277 442 .mainwp-ui.mainwp-custom-theme .ui.green.mini.message:before {
278 - top: 11px;
279 - }
443 + top: 0.9em;
444 +}
280 445
281 446 .mainwp-ui.mainwp-custom-theme .ui.yellow.message {
282 - border-left: 48px solid var( --yellow-color );
447 + background-color: #FFD50010 !important;
448 + border: 1px solid var(--mainwp-yellow) !important;
449 + color: var(--mainwp-text);
450 + padding-left: 3rem;
283 451 }
284 452
285 453 .mainwp-ui.mainwp-custom-theme .ui.yellow.message:before {
286 - content: "\f12a";
287 - font-family: 'Icons';
288 - color: #ffffff;
289 - position: absolute;
290 - top: 14px;
291 - left: -26px;
454 + content: "\f12a";
455 + font-family: 'Icons', sans-serif;
456 + color: var(--mainwp-yellow) !important;
457 + position: absolute;
458 + top: 1rem;
459 + left: 1.5rem;
292 460 }
293 461
294 462 .mainwp-ui.mainwp-custom-theme .ui.yellow.mini.message:before {
295 - top: 11px;
296 - }
463 + top: 0.9em;
464 +}
297 465
298 466 .mainwp-ui.mainwp-custom-theme .ui.red.message {
299 - border-left: 48px solid var( --red-color );
467 + background-color: #AD000010 !important;
468 + border: 1px solid var(--mainwp-red) !important;
469 + color: var(--mainwp-text);
470 + padding-left: 3rem;
300 471 }
301 472
302 473 .mainwp-ui.mainwp-custom-theme .ui.red.message:before {
303 - content: "\f06a";
304 - font-family: 'Icons';
305 - color: #ffffff;
306 - position: absolute;
307 - top: 14px;
308 - left: -28px;
474 + content: "\f00d";
475 + font-family: 'Icons', sans-serif;
476 + color: var(--mainwp-red) !important;
477 + position: absolute;
478 + top: 1rem;
479 + left: 1.5rem;
309 480 }
310 481
311 482 .mainwp-ui.mainwp-custom-theme .ui.red.mini.message:before {
312 - top: 11px;
313 - }
483 + top: 0.9em;
484 +}
314 485
486 +.mainwp-ui.mainwp-custom-theme .ui.attention.message {
487 + background-color: #FFA50010 !important;
488 + border: 1px solid var(--mainwp-orange) !important;
489 + color: var(--mainwp-text);
490 + padding-left: 3rem;
491 +}
492 +
493 +.mainwp-ui.mainwp-custom-theme .ui.attention.message:before {
494 + content: "\f061";
495 + font-family: 'Icons', sans-serif;
496 + color: var(--mainwp-orange) !important;
497 + position: absolute;
498 + top: 1rem;
499 + left: 1.5rem;
500 +}
501 +.mainwp-ui.mainwp-custom-theme .ui.attention.mini.message:before {
502 + top: 0.9em;
503 +}
504 +
505 +.mainwp-ui.mainwp-custom-theme .ui.message a {
506 + color: var(--mainwp-text) !important;
507 + font-weight: 600 !important;
508 +}
509 +
315 510 /* Invert Modal */
316 511
512 +.mainwp-ui.mainwp-custom-theme .ui.modal {
513 + border: 1px solid var(--mainwp-border) !important;
514 +}
515 +
317 516 .mainwp-ui.mainwp-custom-theme .ui.modal > .header {
318 - background-color: var( --grey-dark ) !important;
319 - border-color: var( --grey-dark-alt ) !important;
320 - border-radius: 15px 15px 0 0 !important;
321 - -webkit-border-radius: 15px 15px 0 0 !important;
322 - color: #ffffff !important;
517 + background-color: var(--mainwp-element-background) !important;
518 + border-color: var(--mainwp-border) !important;
519 + border-radius: var(--area-radius) var(--area-radius) 0 0 !important;
520 + -webkit-border-radius: var(--area-radius) var(--area-radius) 0 0 !important;
521 + color: var(--mainwp-text-header) !important;
323 522 padding: 1.5em;
324 523 }
325 524
326 525 .mainwp-ui.mainwp-custom-theme .ui.modal > .actions {
327 - background-color: #ffffff !important;
328 - border-color: var( --grey-light-alt ) !important;
329 - border-radius: 0 0 15px 15px !important;
330 - -webkit-border-radius: 0 0 15px 15px !important;
526 + background-color: var(--mainwp-element-background) !important;
527 + border-color: var(--mainwp-border) !important;
528 + border-radius: 0 0 var(--area-radius) var(--area-radius) !important;
529 + -webkit-border-radius: 0 0 var(--area-radius) var(--area-radius) !important;
331 530 }
332 531
333 532 .mainwp-ui.mainwp-custom-theme .ui.modal,
334 533 .mainwp-ui.mainwp-custom-theme .ui.modal > .content {
335 - background-color: #ffffff;
336 - border-radius: 15px !important;
337 - -webkit-border-radius: 15px !important;
534 + background-color: var(--mainwp-element-background);
535 + border-radius: var(--area-radius) !important;
536 + -webkit-border-radius: var(--area-radius) !important;
537 + color: var(--mainwp-text);
338 538 }
339 539
340 540 .mainwp-ui.mainwp-custom-theme .ui.modal .ui.progress {
341 - background-color: var( --grey-light ) !important;
541 + background-color: var(--mainwp-element-background-secondary) !important;
542 + color: var(--mainwp-text) !important;
342 543 }
343 544
545 +.mainwp-ui.mainwp-custom-theme .ui.modal .ui.progress .label {
546 + color: var(--mainwp-text) !important;
547 +}
548 +
344 549 .mainwp-ui.mainwp-custom-theme .ui.modal .ui.list .item {
345 - border-color: var( --grey-light-alt ) !important;
346 - padding: 10px 0;
550 + border-color: var(--mainwp-border) !important;
551 + padding: 1rem 0;
552 + color: var(--mainwp-text) !important;
347 553 }
348 554
555 +.mainwp-ui.mainwp-custom-theme .ui.modal .ui.list .item .content {
556 + color: var(--mainwp-text) !important;
557 +}
558 +
349 559 .mainwp-ui.mainwp-custom-theme .ui.modal i.icon.close {
350 - top: 1.5em;
351 - right: 1.5em;
352 - color: #ffffff;
560 + top: 1.5rem;
561 + right: 1.5rem;
562 + color: var(--mainwp-text-header) !important;
353 563 opacity: 1 !important;
354 564 text-shadow: none !important;
355 565 }
356 566
357 -.mainwp-ui.mainwp-custom-theme .ui.modals.dimmer {
358 - -webkit-backdrop-filter: blur(5px) grayscale(.7);
359 - backdrop-filter: blur(5px) grayscale(.7);
360 - background: rgba(231, 238, 246, 0.80)
567 +/* Invert Progress UI element */
568 +
569 +.mainwp-ui.mainwp-custom-theme .ui.progress {
570 + background-color: var(--mainwp-element-background-secondary) !important;
571 + color: var(--mainwp-text) !important;
361 572 }
362 573
574 +.mainwp-ui.mainwp-custom-theme .ui.progress[data-percent="0"] .bar .progress {
575 + color: var(--mainwp-text) !important;
576 +}
363 577
578 +.mainwp-ui.mainwp-custom-theme .ui.progress .label {
579 + color: var(--mainwp-text) !important;
580 +}
581 +
364 582 /* Invert Form Fields */
365 583
584 +.mainwp-ui.mainwp-custom-theme .ui[class*="left action"].input input[type="text"] {
585 + border-bottom-left-radius: 0 !important;
586 + border-top-left-radius: 0 !important;
587 +}
588 +
589 +.mainwp-ui.mainwp-custom-theme .ui[class*="right action"].input input[type="text"] {
590 + border-bottom-right-radius: 0 !important;
591 + border-top-right-radius: 0 !important;
592 +}
593 +
366 594 .mainwp-ui.mainwp-custom-theme .ui.form input[type="text"],
367 595 .mainwp-ui.mainwp-custom-theme .ui.form input[type="search"],
368 596 .mainwp-ui.mainwp-custom-theme .ui.form input[type="file"],
597 +.mainwp-ui.mainwp-custom-theme .ui.form input[type="number"],
369 598 .mainwp-ui.mainwp-custom-theme .ui.search .prompt,
370 -.mainwp-ui.mainwp-custom-theme .ui.form input[type="password"] {
371 - background-color: #ffffff !important;
372 - border: 1px solid var( --grey-light-alt ) !important;
373 - border-radius: 10px;
374 - -webkit-border-radius: 10px;
599 +.mainwp-ui.mainwp-custom-theme .ui.form input[type="password"],
600 +.mainwp-ui.mainwp-custom-theme .ui.input input[type="search"],
601 +.mainwp-ui.mainwp-custom-theme .ui.input input[type="color"],
602 +.mainwp-ui.mainwp-custom-theme input[type="color"],
603 +.mainwp-ui.mainwp-custom-theme input#mainwp-select-sites-filter,
604 +.mainwp-ui.mainwp-custom-theme input#mainwp-select-tags-filter,
605 +.mainwp-ui.mainwp-custom-theme .ui.calendar input,
606 +.mainwp-ui.mainwp-custom-theme .ui.form textarea,
607 +.mainwp-ui.mainwp-custom-theme .ui.input > input {
608 + background-color: var(--mainwp-element-background-secondary) !important;
609 + border: 1px solid var(--mainwp-border) !important;
610 + border-radius: var(--input-radius) !important;
611 + -webkit-border-radius: var(--input-radius) !important;
612 + color: var(--mainwp-text);
375 613 }
376 614
615 +.mainwp-ui.mainwp-custom-theme .ui.form input.search {
616 + color: var(--mainwp-text) !important;
617 +}
618 +
619 +.mainwp-ui.mainwp-custom-theme .ui.input input[disabled] {
620 + background-color: var(--mainwp-element-background-secondary) !important;
621 + color: var(--mainwp-text-secondary) !important;
622 +}
623 +
624 +.mainwp-ui.mainwp-custom-theme .ui.icon.input .icon {
625 + color: var(--mainwp-text-secondary) !important;
626 +}
627 +
628 +.ui.form:not(.inverted) .field label:not(.button) {
629 + color: var(--mainwp-text) !important;
630 +}
631 +
632 +.mainwp-ui.mainwp-custom-theme .ui.disabled.checkbox label::before {
633 + background-color: var(--mainwp-base-background-secondary) !important;
634 + border-color: var(--mainwp-border) !important;
635 + box-shadow: none !important;
636 + opacity: 0.75 !important;
637 +}
638 +
639 +.mainwp-ui.mainwp-custom-theme .ui.toggle.checkbox.checked label::before,
640 +.mainwp-ui.mainwp-custom-theme .ui.slide.checkbox.checked label::before {
641 + background: var(--mainwp-green) !important;
642 +}
643 +
644 +.mainwp-ui.mainwp-custom-theme .ui.toggle.checkbox label::before,
645 +.mainwp-ui.mainwp-custom-theme .ui.slide.checkbox label::before {
646 + background-color: var(--mainwp-base-background-secondary) !important;
647 + border: 1px solid var(--mainwp-border) !important;
648 + box-shadow: none !important;
649 +}
650 +
651 +.mainwp-ui.mainwp-custom-theme .ui.checkbox input~label,
652 +.mainwp-ui.mainwp-custom-theme .ui.radio.checkbox input~label {
653 + color: var(--mainwp-text) !important;
654 +}
655 +
656 +.mainwp-ui.mainwp-custom-theme .ui.checkbox.checked input~label,
657 +.mainwp-ui.mainwp-custom-theme .ui.radio.checkbox.checked input~label {
658 + color: var(--mainwp-text) !important;
659 +}
660 +
661 +.mainwp-ui.mainwp-custom-theme .ui.checkbox input~label::before,
662 +.mainwp-ui.mainwp-custom-theme .ui.radio.checkbox input~label::before {
663 + background: var(--mainwp-element-background) !important;
664 + color: var(--mainwp-text) !important;
665 + border: 1px solid var(--mainwp-border-medium) !important;
666 + box-shadow: none !important;
667 +}
668 +
669 +.mainwp-ui.mainwp-custom-theme .ui.checkbox.checked input~label::before,
670 +.mainwp-ui.mainwp-custom-theme .ui.radio.checkbox.checked input~label::before {
671 + background: var(--mainwp-element-background) !important;
672 + border-color: var(--mainwp-green) !important;
673 + color: var(--mainwp-text) !important;
674 + box-shadow: none !important;
675 +}
676 +
677 +.mainwp-ui.mainwp-custom-theme .ui.checkbox input~label::after,
678 +.mainwp-ui.mainwp-custom-theme .ui.radio.checkbox input~label::after {
679 + color: var(--mainwp-text) !important;
680 +}
681 +
682 +.mainwp-ui.mainwp-custom-theme .ui.checkbox.checked input~label::after,
683 +.mainwp-ui.mainwp-custom-theme .ui.radio.checkbox.checked input~label::after {
684 + color: var(--mainwp-text) !important;
685 +}
686 +
687 +.mainwp-ui.mainwp-custom-theme .ui.slider .track {
688 + background-color: var(--mainwp-element-background-secondary) !important;
689 +}
690 +.mainwp-ui.mainwp-custom-theme .ui.slider .track-fill {
691 + background-color: var(--mainwp-green) !important;
692 +}
693 +
694 +.mainwp-ui.mainwp-custom-theme .ui.radio.checkbox input~label::after {
695 + background-color: var(--mainwp-text) !important;
696 +}
697 +
698 +.mainwp-ui.mainwp-custom-theme #mainwp-edit-site-edit-url-www {
699 + border-radius: 0 !important;
700 + -webkit-border-radius: 0 !important;
701 + border-left: none !important;
702 + border-right: none !important;
703 +}
704 +
705 +.mainwp-ui.mainwp-custom-theme #download-mainwp-migration-pass {
706 + border-radius: var(--input-radius) 0 0 var(--input-radius) !important;
707 + -webkit-border-radius: var(--input-radius) 0 0 var(--input-radius) !important;
708 + border-right: none !important;
709 +}
710 +
377 711 .mainwp-ui.mainwp-custom-theme .ui.left.action.input .ui.dropdown {
378 - border-radius: 10px 0 0 10px !important;
379 - -webkit-border-radius: 10px 0 0 10px !important;
712 + border-radius: var(--input-radius) 0 0 var(--input-radius) !important;
713 + -webkit-border-radius: var(--input-radius) 0 0 var(--input-radius) !important;
714 + color: var(--mainwp-text);
380 715 }
381 716
382 717 .mainwp-ui.mainwp-custom-theme .ui.dropdown.selection {
383 - border: 1px solid var( --grey-light-alt ) !important;
384 - border-radius: 10px;
385 - -webkit-border-radius: 10px;
386 - background: #ffffff !important;
718 + border: 1px solid var(--mainwp-border) !important;
719 + border-radius: var(--input-radius);
720 + -webkit-border-radius: var(--input-radius);
721 + background: var(--mainwp-element-background-secondary) !important;
722 + color: var(--mainwp-text);
387 723 }
388 724
389 -.mainwp-ui.mainwp-custom-theme .ui.form textarea {
390 - border-radius: 10px;
391 - -webkit-border-radius: 10px;
725 +.mainwp-ui.mainwp-custom-theme .ui.dimmer .ui.dropdown .text,
726 +.mainwp-ui.mainwp-custom-theme .ui.dropdown .text {
727 + color: var(--mainwp-text) !important;
392 728 }
393 729
730 +.mainwp-ui.mainwp-custom-theme .ui.dropdown .menu {
731 + background-color: var(--mainwp-element-background-secondary);
732 + border-color: var(--mainwp-border) !important;
733 +}
734 +
735 +.mainwp-ui.mainwp-custom-theme .ui.dropdown .menu:after {
736 + background: var(--mainwp-element-background-secondary) !important;
737 + border-left: 1px solid var(--mainwp-border) !important;
738 + border-top: 1px solid var(--mainwp-border) !important;
739 +}
740 +
741 +.mainwp-ui.mainwp-custom-theme .ui.dropdown .menu .item {
742 + color: var(--mainwp-text);
743 + border-color: var(--mainwp-border) !important;
744 +}
745 +
746 +.mainwp-ui.mainwp-custom-theme .ui.dropdown .menu .item.active,
747 +.mainwp-ui.mainwp-custom-theme .ui.dropdown .menu .item.selected {
748 + border-color: var(--mainwp-border) !important;
749 + background-color: var(--mainwp-element-background) !important;
750 + color: var(--mainwp-text);
751 +}
752 +
753 +.mainwp-ui.mainwp-custom-theme .ui.active.dropdown .menu .item:hover {
754 + background-color: var(--mainwp-element-background) !important;
755 +}
756 +
757 +.mainwp-ui.mainwp-custom-theme .ui.active.dropdown .menu .message {
758 + color: var(--mainwp-text);
759 +}
760 +
761 +.mainwp-ui.mainwp-custom-theme #mainwp-select-tags-filter,
762 +.mainwp-ui.mainwp-custom-theme #mainwp-select-sites-filter {
763 + border-radius: 16px !important;
764 + -webkit-border-radius: 16px !important;
765 +}
766 +
767 +.mainwp-ui.mainwp-custom-theme .mainwp-actions-bar .ui.dropdown,
768 +.mainwp-ui.mainwp-custom-theme .mainwp-actions-bar .ui.search input,
769 +.mainwp-ui.mainwp-custom-theme .mainwp-sub-header .ui.dropdown,
770 +.mainwp-ui.mainwp-custom-theme .mainwp-sub-header input {
771 + border-radius: 16px !important;
772 + -webkit-border-radius: 16px !important;
773 + color: var(--mainwp-text);
774 +}
775 +
776 +/* Invert Editor */
777 +
778 +.mainwp-ui.mainwp-custom-theme #wp-content-editor-tools {
779 + background-color: var(--mainwp-base-background) !important;
780 +}
781 +
782 +.mainwp-ui.mainwp-custom-theme #post-status-info {
783 + background: var(--mainwp-element-background);
784 + border: 0px solid var(--mainwp-element-background) !important;
785 +}
786 +
394 787 /* Lists */
395 -.mainwp-ui.mainwp-custom-theme .ui.divided.list .item {
396 - border-color: var( --grey-light ) !important;
788 +.mainwp-ui.mainwp-custom-theme .ui.selection.list .list > .item,
789 +.mainwp-ui.mainwp-custom-theme .ui.selection.list > .item {
790 + border-color: var(--mainwp-border) !important;
791 + padding: .5rem 0;
792 + color: var(--mainwp-text) !important;
397 793 }
398 794
399 -.mainwp-ui.mainwp-custom-theme .ui.divided.list .item:hover {
400 - background-color: var( --grey-light ) !important;
795 +.mainwp-ui.mainwp-custom-theme .ui.divided.list > .item {
796 + border-color: var(--mainwp-border) !important;
797 + padding: .5rem 0;
401 798 }
402 799
800 +.mainwp-ui.mainwp-custom-theme .ui.list .item .content,
801 +.mainwp-ui.mainwp-custom-theme .ui.list .item .content .description {
802 + color: var(--mainwp-text) !important;
803 +}
804 +.mainwp-ui.mainwp-custom-theme .ui.list .item .content .header {
805 + color: var(--mainwp-text-header) !important;
806 +}
807 +
403 808 /* Cards */
404 809
405 810 .mainwp-ui.mainwp-custom-theme .ui.cards .card {
406 - background-color: #ffffff;
407 - border: none !important;
408 - box-shadow: 0 1px 2px 0 rgba( 0, 0, 0, .1 );
409 - border-radius: 15px;
410 - -webkit-border-radius: 15px;
811 + background-color: var(--mainwp-element-background);
812 + border: 1px solid var(--mainwp-border) !important;
813 + box-shadow: none;
814 + border-radius: var(--area-radius);
815 + -webkit-border-radius: var(--area-radius);
411 816 }
412 817
818 +.mainwp-ui.mainwp-custom-theme .ui.cards .primary.card {
819 + background-color: var(--mainwp-element-background);
820 +}
821 +
822 +.mainwp-ui.mainwp-custom-theme .ui.cards .secondary.card {
823 + background-color: var(--mainwp-element-background-secondary) !important;
824 + border-color: var(--mainwp-green) !important;
825 +}
826 +
827 +.mainwp-ui.mainwp-custom-theme .ui.cards .card .description,
828 +.mainwp-ui.mainwp-custom-theme .ui.cards .card .meta {
829 + color: var(--mainwp-text);
830 +}
831 +
832 +.mainwp-ui.mainwp-custom-theme .ui.cards .card .meta a {
833 + color: var(--mainwp-link-color);
834 +}
835 +
836 +.mainwp-ui.mainwp-custom-theme .ui.cards .card .header {
837 + color: var(--mainwp-text-header);
838 +}
839 +
840 +.mainwp-ui.mainwp-custom-theme .ui.cards .card .content {
841 + color: var(--mainwp-text);
842 + background: none !important;
843 +}
844 +
845 +.mainwp-ui.mainwp-custom-theme .ui.cards .card .extra a:not(.ui) {
846 + color: var(--mainwp-link-color) !important;
847 +}
848 +
413 849 .mainwp-ui.mainwp-custom-theme #mainwp-sites-previews .ui.cards .image,
414 850 .mainwp-ui.mainwp-custom-theme #mainwp-sites-previews .ui.cards .image img {
415 - border-radius: 15px 15px 0 0 !important;
416 - -webkit-border-radius: 15px 15px 0 0 !important;
851 + border-radius: var(--area-radius) var(--area-radius) 0 0 !important;
852 + -webkit-border-radius: var(--area-radius) var(--area-radius) 0 0 !important;
417 853 }
418 854
855 +.mainwp-ui.mainwp-custom-theme .ui.segment.mainwp-widget .segment {
856 + background-color: var(--mainwp-element-background) !important;
857 +}
858 +
859 +.mainwp-ui.mainwp-custom-theme .mainwp-widget .ui.cards .card {
860 + border: 1px solid var(--mainwp-border) !important;
861 + box-shadow: none !important;
862 +}
863 +
864 +.mainwp-ui.mainwp-custom-theme .mainwp-widget .ui.cards .inverted.card {
865 + background-color: var(--mainwp-element-background-secondary);
866 +}
867 +.mainwp-ui.mainwp-custom-theme .mainwp-widget .ui.cards .light.card {
868 + background-color: var(--mainwp-element-background-secondary);
869 +}
870 +
871 +.mainwp-ui.mainwp-custom-theme .ui.cards .extension.card .extra.content {
872 + border-radius: 0 !important;
873 +}
874 +
875 +.mainwp-ui.mainwp-custom-theme .ui.cards .extension.card.green {
876 + box-shadow: 0 2px 0 0 var(--mainwp-green);
877 +}
878 +
879 +.mainwp-ui.mainwp-custom-theme .ui.cards .extension.card.grey {
880 + box-shadow: 0 2px 0 0 var(--mainwp-border);
881 +}
882 +
419 883 /* Tables */
420 884
421 885 .mainwp-ui.mainwp-custom-theme .ui.table {
422 - border: none;
423 - box-shadow: 0 1px 2px 0 rgba( 0, 0, 0, .1 );
886 + background: var(--mainwp-element-background);
887 + border: none !important;
888 + box-shadow: none !important;
889 + color: var(--mainwp-text);
890 + border-radius: var(--area-radius) !important;
424 891 }
425 892
426 -.mainwp-ui.mainwp-custom-theme .dataTables_scroll {
427 - box-shadow: 0 1px 2px 0 rgba( 0, 0, 0, .1 );
893 +.mainwp-ui.mainwp-custom-theme table.dataTable thead > tr > th.dt-orderable-asc:hover,
894 +.mainwp-ui.mainwp-custom-theme table.dataTable thead > tr > th.dt-orderable-desc:hover,
895 +.mainwp-ui.mainwp-custom-theme table.dataTable thead > tr > td.dt-orderable-asc:hover,
896 +.mainwp-ui.mainwp-custom-theme table.dataTable thead > tr > td.dt-orderable-desc:hover {
897 + outline: none !important;
428 898 }
429 899
430 -.mainwp-ui.mainwp-custom-theme .ui.table > tbody > tr.odd > * {
431 - box-shadow: inset 0 0 0 9999px rgba( 45, 59, 68, .02 );
900 +.mainwp-ui.mainwp-custom-theme .ui.table > thead > tr > th {
901 + color: var(--mainwp-text-header) !important;
902 + border-bottom: 1px solid var(--mainwp-border) !important;
903 + font-weight: 600 !important;
432 904 }
905 +.mainwp-ui.mainwp-custom-theme .ui.table > tfoot > tr > th {
906 + color: var(--mainwp-text-header) !important;
907 + border-top: 1px solid var(--mainwp-border) !important;
908 + font-weight: 600 !important;
909 +}
433 910
434 -.mainwp-ui.mainwp-custom-theme .ui.ui.selectable.table > tbody > tr:hover,
435 -.mainwp-ui.mainwp-custom-theme .ui.table tbody tr td.selectable:hover {
436 - background-color: var( --grey-light ) !important;
911 +.mainwp-ui.mainwp-custom-theme .ui.table:not(.day, .hour, .minute) > tfoot > tr > th,
912 +.mainwp-ui.mainwp-custom-theme .ui.table:not(.day, .hour, .minute) > thead > tr > th {
913 + background: var(--mainwp-element-background) !important;
914 + padding: var(--mainwp-area-padding);
915 + color: var(--mainwp-text-header);
437 916 }
438 917
439 -.mainwp-ui.mainwp-custom-theme .ui.table > thead > tr > th,
440 -.mainwp-ui.mainwp-custom-theme .ui.table > tfoot > tr > th {
441 - background-color: var( --grey-light-alt );
442 - border-color: var( --grey-light ) !important;
918 +.mainwp-ui.mainwp-custom-theme .ui.table:not(.day, .hour, .minute, .compact) > tbody > tr > td,
919 +.mainwp-ui.mainwp-custom-theme .ui.table:not(.day, .hour, .minute, .compact) > tr > td {
920 + padding: var(--mainwp-area-padding);
921 + background: var(--mainwp-element-background) !important;
922 + color: var(--mainwp-text);
443 923 }
924 +.mainwp-ui.mainwp-custom-theme .ui.table:not(.day, .hour, .minute, .compact) > tbody > tr.error > td,
925 +.mainwp-ui.mainwp-custom-theme .ui.table:not(.day, .hour, .minute, .compact) > tbody > tr.negative > td {
926 + background-color: #AD000010 !important;
927 +}
928 +.mainwp-ui.mainwp-custom-theme .ui.table:not(.day, .hour, .minute, .compact) > tbody > tr.error > td a,
929 +.mainwp-ui.mainwp-custom-theme .ui.table:not(.day, .hour, .minute, .compact) > tbody > tr.negative > td a {
930 + text-decoration: none !important;
931 +}
932 +.mainwp-ui.mainwp-custom-theme .ui.table:not(.day, .hour, .minute, .compact) > tbody > tr.warning > td {
933 + background-color: #FFD50010 !important;
934 +}
935 +.mainwp-ui.mainwp-custom-theme .ui.table:not(.day, .hour, .minute, .compact) > tbody > tr.positive {
936 + background-color: var(--mainwp-element-background) !important;
937 +}
938 +.mainwp-ui.mainwp-custom-theme .ui.table:not(.day, .hour, .minute, .compact) > tbody > tr.positive > td {
939 + background-color: #6c980012 !important;
940 +}
941 +.mainwp-ui.mainwp-custom-theme .ui.table > thead > tr:first-child > th:first-child {
942 + border-radius: var(--area-radius) 0 0 0 !important;
943 +}
944 +.mainwp-ui.mainwp-custom-theme .ui.table > thead > tr:last-child > th:last-child {
945 + border-radius: 0 var(--area-radius) 0 0 !important;
946 +}
947 +.mainwp-ui.mainwp-custom-theme .ui.table > thead > tr:first-child > th:first-child:last-child {
948 + border-radius: var(--area-radius) var(--area-radius) 0 0 !important;
949 +}
950 +.mainwp-ui.mainwp-custom-theme .ui.table > tbody > tr:last-child > td:first-child {
951 + border-radius: 0 0 0 var(--area-radius) !important;
952 +}
953 +.mainwp-ui.mainwp-custom-theme .ui.table > tbody > tr:last-child > td:last-child {
954 + border-radius: 0 0 var(--area-radius) 0 !important;
955 +}
956 +.mainwp-ui.mainwp-custom-theme .ui.table > tbody > tr:last-child > td:first-child:last-child {
957 + border-radius: 0 0 var(--area-radius) var(--area-radius) !important;
958 +}
444 959
445 -.mainwp-ui.mainwp-custom-theme .ui.table > tbody > tr > td,
446 -.mainwp-ui.mainwp-custom-theme .ui.table > tr > td {
447 - border-color: var( --grey-light ) !important;
448 -
960 +.mainwp-ui table.dataTable thead tr th.check-column {
961 + text-align: center !important;
449 962 }
963 +.mainwp-ui table.dataTable thead tr th.check-column .ui.checkbox {
964 + max-width: 17px !important;
965 +}
966 +.mainwp-ui table.dataTable tbody tr td.check-column {
967 + text-align: center !important;
968 +}
969 +.mainwp-ui table.dataTable tbody tr td.check-column .ui.checkbox {
970 + max-width: 17px !important;
971 +}
450 972
451 -.mainwp-ui table.dataTable tbody tr > .dtfc-fixed-left,
452 -.mainwp-ui table.dataTable tbody tr > .dtfc-fixed-right {
453 - background-color: var( --grey-light ) !important;
973 +.mainwp-ui.mainwp-custom-theme table.dataTable tr th:last-child,
974 +.mainwp-ui.mainwp-custom-theme table.dataTable tr td:last-child {
975 + border-right: none !important;
454 976 }
455 977
456 -.mainwp-ui.mainwp-custom-theme .ui.table:not( .day, .hour, .minute ) > thead > tr > th,
457 -.mainwp-ui.mainwp-custom-theme .ui.table:not( .day, .hour, .minute ) > tfoot > tr > th,
458 -.mainwp-ui.mainwp-custom-theme .ui.table:not( .day, .hour, .minute ) > tbody > tr > td,
459 -.mainwp-ui.mainwp-custom-theme .ui.table:not( .day, .hour, .minute ) > tr > td {
460 - padding-top: 20px;
461 - padding-bottom: 20px;
978 +.mainwp-ui.mainwp-custom-theme .ui.ui.selectable.table > tbody > tr:hover,
979 +.mainwp-ui.mainwp-custom-theme .ui.table tbody tr td.selectable:hover {
980 + background-color: var(--mainwp-element-background-secondary) !important;
462 981 }
463 982
464 983 .mainwp-ui.mainwp-custom-theme .ui.table > tbody > tr.active {
465 - background-color: var( --grey-light ) !important;
984 + background-color: var(--mainwp-element-background-secondary) !important;
985 + color: var(--mainwp-text) !important;
466 986 }
467 987
468 988 .mainwp-ui.mainwp-custom-theme .ui.table > tbody > tr.warning,
469 989 .mainwp-ui.mainwp-custom-theme .ui.table > tbody > tr.suspended {
@@ -469,177 +989,500 @@
469 989 .mainwp-ui.mainwp-custom-theme .ui.table > tbody > tr.suspended {
470 990 background-color: #FFD30007 !important;
471 991 }
472 992
473 -.mainwp-ui.mainwp-custom-theme .ui.table > tbody > tr.warning td:first-child,
474 -.mainwp-ui.mainwp-custom-theme .ui.table > tbody > tr.suspended td:first-child {
475 - border-left: 5px solid var( --yellow-color) !important;
993 +.mainwp-ui.mainwp-custom-theme .ui.table > tbody > tr.error {
994 + background-color: #AD000007 !important;
476 995 }
477 996
478 -.mainwp-ui.mainwp-custom-theme .ui.table > tbody > tr.error {
479 - background-color: #AD000007 !important;
997 +.mainwp-ui.mainwp-custom-theme .ui.table>tbody>tr>td,
998 +.mainwp-ui.mainwp-custom-theme .ui.table>tr>td {
999 + border-color: var(--mainwp-border) !important;
480 1000 }
481 1001
482 -.mainwp-ui.mainwp-custom-theme .ui.table > tbody > tr.error td:first-child {
483 - border-left: 5px solid var( --red-color) !important;
1002 +.mainwp-ui table.dataTable tbody tr > .dtfc-fixed-left,
1003 +.mainwp-ui table.dataTable tbody tr > .dtfc-fixed-right {
1004 + background-color: var(--mainwp-element-background-secondary) !important;
484 1005 }
485 1006
486 -.mainwp-ui.mainwp-custom-theme #mainwp-http-response-issues-table tr > th {
487 - background-color: var( --grey-dark );
488 - border-color: var( --grey-dark-alt ) !important;
1007 +.mainwp-ui.mainwp-custom-theme .ui.table > tfoot {
1008 + display: none;
489 1009 }
490 1010
491 -.mainwp-ui.mainwp-custom-theme #mainwp-http-response-issues-table tr > td {
492 - background-color: var( --grey-dark-alt );
1011 +.mainwp-ui.mainwp-custom-theme table th .sort.icon:not(.up, .down):before {
1012 + opacity: 0.125;
1013 + font-size: 0.8em !important;
1014 + line-height: 9px;
1015 + content: "\f106";
1016 + content: "\f106"/"";
1017 + font-family: "icons", sans-serif;
1018 + position: relative;
1019 + bottom: 0%;
1020 + display: block;
493 1021 }
1022 +.mainwp-ui.mainwp-custom-theme table th .sort.icon:not(.up, .down):after {
1023 + opacity: 0.125;
1024 + font-size: 0.8em !important;
1025 + line-height: 9px;
1026 + content: "\f107";
1027 + content: "\f107"/"";
1028 + font-family: "icons", sans-serif;
1029 + position: relative;
1030 + top: 0%;
1031 + display: block;
1032 +}
494 1033
1034 +.mainwp-ui.mainwp-custom-theme table th .up.icon:before {
1035 + opacity: 0.625;
1036 + font-size: 0.8em !important;
1037 + line-height: 9px;
1038 + content: "\f106";
1039 + content: "\f106"/"";
1040 + font-family: "icons", sans-serif;
1041 + position: relative;
1042 + bottom: 0%;
1043 + display: block;
1044 +}
1045 +.mainwp-ui.mainwp-custom-theme table th .up.icon:after {
1046 + opacity: 0.125;
1047 + font-size: 0.8em !important;
1048 + line-height: 9px;
1049 + content: "\f107";
1050 + content: "\f107"/"";
1051 + font-family: "icons", sans-serif;
1052 + position: relative;
1053 + top: 0%;
1054 + display: block;
1055 +}
1056 +
1057 +.mainwp-ui.mainwp-custom-theme table th .down.icon:before {
1058 + opacity: 0.125;
1059 + font-size: 0.8em !important;
1060 + line-height: 9px;
1061 + content: "\f106";
1062 + content: "\f106"/"";
1063 + font-family: "icons", sans-serif;
1064 + position: relative;
1065 + bottom: 0%;
1066 + display: block;
1067 +}
1068 +.mainwp-ui.mainwp-custom-theme table th .down.icon:after {
1069 + opacity: 0.625;
1070 + font-size: 0.8em !important;
1071 + line-height: 9px;
1072 + content: "\f107";
1073 + content: "\f107"/"";
1074 + font-family: "icons", sans-serif;
1075 + position: relative;
1076 + top: 0%;
1077 + display: block;
1078 +}
1079 +
1080 +/* Invert Calendar */
1081 +
1082 +.mainwp-ui.mainwp-custom-theme .ui.calendar thead,
1083 +.mainwp-ui.mainwp-custom-theme .ui.calendar thead th {
1084 + background-color: var(--mainwp-element-background) !important;
1085 +}
1086 +
1087 +.mainwp-ui.mainwp-custom-theme .ui.calendar:before {
1088 + background-color: var(--mainwp-element-background) !important;
1089 +}
1090 +
495 1091 /* Pagination */
496 1092
497 1093 .mainwp-ui.mainwp-custom-theme .ui.pagination.menu {
498 -box-shadow: 0 1px 2px 0 rgba( 0, 0, 0, .1 );
499 - border-radius: 10px;
500 - border: 1px solid var( --grey-light-alt ) !important;
1094 + background-color: var(--mainwp-element-background);
1095 + border-radius: var(--input-radius);
1096 + -webkit-border-radius: var(--input-radius);
1097 + border: 1px solid var(--mainwp-border) !important;
1098 + overflow: hidden;
501 1099 }
1100 +.mainwp-ui.mainwp-custom-theme .ui.pagination.menu .item a {
1101 + color: var(--mainwp-link-color) !important;
1102 + padding: 0.5rem 1rem !important;
1103 +}
1104 +.mainwp-ui.mainwp-custom-theme .ui.pagination.menu .item:hover,
1105 +.mainwp-ui.mainwp-custom-theme .ui.pagination.menu .item.active {
1106 + background: var(--mainwp-element-background-secondary);
1107 + padding: 0.5rem 1rem !important;
1108 +}
1109 +.mainwp-ui.mainwp-custom-theme .ui.pagination.menu .item:hover .page-link,
1110 +.mainwp-ui.mainwp-custom-theme .ui.pagination.menu .item.active .page-link {
1111 + color: var(--mainwp-text-secondary) !important;
1112 +}
502 1113
503 -.mainwp-ui.mainwp-custom-theme .ui.pagination.menu .item.active {
504 - background-color: var( --grey-light-alt );
1114 +.mainwp-ui.mainwp-custom-theme .ui.pagination.menu .item.disabled .page-link {
1115 + color: var(--mainwp-text-secondary) !important;
505 1116 }
506 1117
1118 +.mainwp-ui.mainwp-custom-theme div.dt-container .dt-paging .dt-paging-button.disabled,
1119 +.mainwp-ui.mainwp-custom-theme div.dt-container .dt-paging .dt-paging-button.disabled:hover,
1120 +.mainwp-ui.mainwp-custom-theme div.dt-container .dt-paging .dt-paging-button.disabled:active {
1121 + color: var(--mainwp-text-secondary) !important;
1122 +}
1123 +
507 1124 /* Tooltips */
508 1125
509 -.mainwp-ui.mainwp-custom-theme [data-tooltip]:before,
510 -.mainwp-ui.mainwp-custom-theme [data-tooltip]:after,
511 -.mainwp-ui.mainwp-custom-theme .ui.popup:not( .calendar, .menu, .mainwp-popup-tooltip ):before
512 -.mainwp-ui.mainwp-custom-theme .ui.popup:not( .calendar, .menu, .mainwp-popup-tooltip ):after {
513 - background-color: var( --grey-dark-alt ) !important;
514 - border-color: var( --grey-dark ) !important;
515 - box-shadow: 0 1px 2px 0 rgba( 0, 0, 0, .1 );
516 - z-index: 99 !important;
1126 +.mainwp-ui.mainwp-custom-theme [data-tooltip]::before,
1127 +.mainwp-ui.mainwp-custom-theme [data-tooltip]::after,
1128 +.mainwp-ui.mainwp-custom-theme .ui.slider [data-tooltip][data-variation="black"]::after,
1129 +.mainwp-ui.mainwp-custom-theme .ui.popup:not(.calendar, .menu, .mainwp-popup-tooltip, .mainwp-help-popup),
1130 +.mainwp-ui.mainwp-custom-theme .ui.popup:not(.calendar, .menu, .mainwp-popup-tooltip, .mainwp-help-popup):before,
1131 +.mainwp-ui.mainwp-custom-theme .ui.popup:not(.calendar, .menu, .mainwp-popup-tooltip, .mainwp-help-popup):after {
1132 + background: var(--mainwp-text-header) !important;
1133 + border: 1px solid var(--mainwp-text-header) !important;
517 1134 color: #ffffff !important;
1135 + box-shadow: none !important;
518 1136 }
519 1137
1138 +.mainwp-ui.mainwp-custom-theme .ui.popup:not(.calendar, .menu, .mainwp-popup-tooltip, .mainwp-help-popup) .header {
1139 + color: #ffffff !important;
1140 +}
1141 +
1142 +.mainwp-ui.mainwp-custom-theme .mainwp-help-popup,
1143 +.mainwp-ui.mainwp-custom-theme .mainwp-help-popup:before {
1144 + background: var(--mainwp-text) !important;
1145 + border: var(--mainwp-text) !important;
1146 +}
1147 +
1148 +.mainwp-ui.mainwp-custom-theme .mainwp-help-popup .ui.header {
1149 + color: var(--mainwp-base-background) !important;
1150 +}
1151 +
1152 +.mainwp-help-popup p { color: #ffffff }
1153 +
1154 +/* Placeholder */
1155 +
1156 +.mainwp-ui.mainwp-custom-theme .mainwp-no-results-placeholder {
1157 + opacity: .2;
1158 +}
1159 +
1160 +.mainwp-ui.mainwp-custom-theme .ui.placeholder {
1161 + opacity: 0.02;
1162 +}
1163 +
520 1164 /* Main Navigation
521 1165 ========================================================================== */
522 1166
523 1167 .mainwp-ui.mainwp-custom-theme #mainwp-main-navigation-container {
524 - background-color: var( --grey-dark-alt ) !important;
1168 + background-color: var(--mainwp-shell-background) !important;
525 1169 }
526 1170
1171 +
527 1172 .mainwp-ui.mainwp-custom-theme #mainwp-first-level-navigation,
528 1173 .mainwp-ui.mainwp-custom-theme #mainwp-first-level-navigation:hover,
529 1174 .mainwp-ui.mainwp-custom-theme #mainwp-first-level-navigation-menu {
530 - background-color: var( --grey-dark ) !important;
1175 + background-color: var(--mainwp-shell-background) !important;
531 1176 }
532 1177
1178 +.mainwp-ui.mainwp-custom-theme #mainwp-first-level-navigation {
1179 + padding-top: 2em;
1180 +}
1181 +
1182 +.mainwp-ui.mainwp-custom-theme #mainwp-first-level-navigation::before {
1183 + width: 25px;
1184 + height: 25px;
1185 + top: 0px;
1186 + left: 72px;
1187 + position: absolute;
1188 + border-top-left-radius: 50%;
1189 + content: "";
1190 + box-shadow: var(--mainwp-shell-background) -10px 0px 0px 0px;
1191 + pointer-events: none;
1192 + z-index: 99999;
1193 +}
1194 +.mainwp-ui.mainwp-custom-theme #mainwp-first-level-navigation::after {
1195 + width: 20px;
1196 + height: 20px;
1197 + bottom: 0px;
1198 + left: 72px;
1199 + position: absolute;
1200 + border-bottom-left-radius: 50%;
1201 + content: "";
1202 + box-shadow: var(--mainwp-green) -10px 0px 0px 0px;
1203 + pointer-events: none;
1204 + z-index: 99999;
1205 +}
1206 +
1207 +.mainwp-ui.mainwp-custom-theme #mainwp-first-level-navigation .ui.vertical.inverted.menu .item {
1208 + border-radius: 0.785rem !important;
1209 + -webkit-border-radius: 0.785rem !important;
1210 + border: 1px solid transparent !important;
1211 +}
1212 +
533 1213 .mainwp-ui.mainwp-custom-theme #mainwp-first-level-navigation .ui.vertical.inverted.menu .item,
534 1214 .mainwp-ui.mainwp-custom-theme #mainwp-first-level-navigation .ui.vertical.inverted.menu .item .text,
535 1215 .mainwp-ui.mainwp-custom-theme #mainwp-first-level-navigation .ui.vertical.inverted.menu .item .icon {
536 - color: var( --grey-light-alt ) !important;
1216 + color: var(--mainwp-text) !important;
537 1217 }
538 1218
539 -.mainwp-ui.mainwp-custom-theme #mainwp-first-level-navigation .ui.vertical.inverted.menu .item.active,
1219 +.mainwp-ui.mainwp-custom-theme #mainwp-support-menu a#mainwp-help-menu-item,
1220 +.mainwp-ui.mainwp-custom-theme #mainwp-support-menu a#mainwp-help-menu-item .icon,
1221 +.mainwp-ui.mainwp-custom-theme #mainwp-support-menu a#mainwp-help-menu-item .text {
1222 + color: var(--mainwp-text) !important;
1223 +}
1224 +
1225 +.mainwp-ui.mainwp-custom-theme #mainwp-first-level-navigation .ui.vertical.inverted.menu .item.active {
1226 + color: var(--mainwp-green) !important;
1227 + background-color: var(--mainwp-element-background) !important;
1228 +}
1229 +
1230 +.mainwp-ui.mainwp-custom-theme #mainwp-divider-handle:hover {
1231 + background-color: var(--mainwp-shell-background-hover) !important;
1232 +}
1233 +
1234 +.mainwp-ui.mainwp-custom-theme #mainwp-collapse-second-level-navigation {
1235 + background-color: var(--mainwp-element-background) !important;
1236 + border: 1px solid var(--mainwp-border-medium);
1237 + color: var(--mainwp-green);
1238 +}
1239 +
540 1240 .mainwp-ui.mainwp-custom-theme #mainwp-first-level-navigation .ui.vertical.inverted.menu .item.active .text,
541 1241 .mainwp-ui.mainwp-custom-theme #mainwp-first-level-navigation .ui.vertical.inverted.menu .item.active .icon {
542 - color: #fff !important;
543 - background-color: var( --accent ) !important;
1242 + color: var(--mainwp-green) !important;
544 1243 }
545 1244
546 -.mainwp-ui.mainwp-custom-theme #mainwp-second-level-navigation,
1245 +.mainwp-ui.mainwp-custom-theme #mainwp-second-level-navigation {
1246 + background-color: var(--mainwp-element-background-secondary) !important;
1247 + border-left: 1px solid var(--mainwp-element-background-secondary);
1248 + border-right: 1px solid var(--mainwp-element-background);
1249 + box-shadow: none !important;
1250 + -webkit-box-shadow: none !important;
1251 +}
1252 +
1253 +.mainwp-ui.mainwp-custom-theme #mainwp-second-level-navigation::before {
1254 + width: 25px;
1255 + height: 25px;
1256 + top: 0px;
1257 + left: 272px;
1258 + position: absolute;
1259 + border-top-left-radius: 50%;
1260 + content: "";
1261 + box-shadow: var(--mainwp-element-background-secondary) -10px 0px 0px 0px;
1262 + pointer-events: none;
1263 + z-index: 99999;
1264 +}
1265 +
1266 +.mainwp-ui.mainwp-custom-theme #mainwp-second-level-navigation::after {
1267 + width: 25px;
1268 + height: 25px;
1269 + bottom: 0px;
1270 + left: 272px;
1271 + position: absolute;
1272 + border-bottom-left-radius: 50%;
1273 + content: "";
1274 + box-shadow: var(--mainwp-element-background-secondary) -10px 0px 0px 0px;
1275 + pointer-events: none;
1276 + z-index: 99999;
1277 +}
1278 +
1279 +.mainwp-ui.mainwp-custom-theme #mainwp-second-level-navigation .ui.accordion .title {
1280 + padding: 0.9rem !important;
1281 +}
1282 +
1283 +.mainwp-ui.mainwp-custom-theme #mainwp-second-level-navigation .ui.accordion .title,
1284 +.mainwp-ui.mainwp-custom-theme #mainwp-second-level-navigation .ui.accordion .content {
1285 + background: none !important;
1286 +}
1287 +
547 1288 .mainwp-ui.mainwp-custom-theme #mainwp-second-level-navigation .ui.inverted.menu {
548 - background-color: var( --grey-dark-alt ) !important;
1289 + background-color: var(--mainwp-element-background-secondary) !important;
1290 + box-shadow: none !important;
1291 + -webkit-box-shadow: none !important;
549 1292 }
550 1293
551 -.mainwp-ui.mainwp-custom-theme #mainwp-second-level-navigation .ui.inverted.menu .item {
552 - font-weight: 700;
1294 +.mainwp-ui.mainwp-custom-theme #mainwp-second-level-navigation .ui.inverted.menu .item {
1295 + color: var(--mainwp-text) !important;
1296 + font-weight: 300;
1297 + font-size: 0.9rem !important;
1298 + box-shadow: none !important;
1299 + -webkit-box-shadow: none !important;
1300 + padding: 0 !important;
1301 +
553 1302 }
554 1303
555 -.mainwp-ui.mainwp-custom-theme #mainwp-second-level-navigation .ui.inverted.menu.active .item,
556 -.mainwp-ui.mainwp-custom-theme #mainwp-second-level-navigation .ui.inverted.menu .item.active,
557 -.mainwp-ui.mainwp-custom-theme #mainwp-second-level-navigation .ui.inverted.menu .item:hover {
558 - background-color: rgba(255, 255, 255, 0.08) !important;
1304 +.mainwp-ui.mainwp-custom-theme .mainwp-main-navigation-menu .icon,
1305 +.mainwp-ui.mainwp-custom-theme #mainwp-main-menu .icon.left.floated,
1306 +.mainwp-ui.mainwp-custom-theme #mainwp-second-level-navigation .ui.inverted.menu .item a,
1307 +.mainwp-ui.mainwp-custom-theme #mainwp-second-level-navigation .ui.inverted.menu .item .title,
1308 +.mainwp-ui.mainwp-custom-theme #mainwp-second-level-navigation .ui.inverted.menu .item .content {
1309 + color: var(--mainwp-text) !important;
559 1310 }
560 1311
561 -.mainwp-ui.mainwp-custom-theme #mainwp-second-level-navigation .ui.inverted.menu .item .item {
1312 +.mainwp-ui.mainwp-custom-theme #mainwp-second-level-navigation .ui.inverted.menu .item .icon:not(.green, .red, .yellow, .blue) {
1313 + color: var(--mainwp-text-secondary) !important;
1314 +}
1315 +
1316 +.mainwp-ui.mainwp-custom-theme #mainwp-second-level-navigation .ui.inverted.menu .item:before {
1317 + display: none !important;
1318 +}
1319 +
1320 +.mainwp-ui.mainwp-custom-theme #mainwp-second-level-navigation .ui.inverted.menu .item .ui.mini.label {
1321 + float: right;
1322 +}
1323 +
1324 +.mainwp-ui.mainwp-custom-theme #mainwp-second-level-navigation .ui.inverted.menu .item .dropdown.icon {
1325 + color: var(--mainwp-text-secondary) !important;
1326 + opacity: 0.5;
1327 + margin-right: 5px;
1328 + margin-top: 2px;
1329 + float: left;
1330 + transform: rotate(0deg) !important;
1331 +}
1332 +
1333 +.mainwp-ui.mainwp-custom-theme #mainwp-second-level-navigation .ui.inverted.menu .item.active .dropdown.icon {
1334 + transform: rotate(90deg) !important;
1335 + opacity: 1;
1336 + color: var(--mainwp-green) !important;
1337 +}
1338 +
1339 +.mainwp-ui.mainwp-custom-theme #mainwp-second-level-navigation .ui.inverted.menu.active .item {
1340 + background-color: var(--mainwp-element-background-secondary) !important;
1341 +}
1342 +.mainwp-ui.mainwp-custom-theme #mainwp-second-level-navigation .ui.inverted.menu > .item.active,
1343 +.mainwp-ui.mainwp-custom-theme #mainwp-second-level-navigation .ui.inverted.menu > .item:hover {
1344 + background: none !important;
1345 +}
1346 +
1347 +.mainwp-ui.mainwp-custom-theme #mainwp-second-level-navigation .ui.inverted.menu .item .content.active {
1348 + border-top: 1px solid var(--mainwp-border);
1349 + border-bottom: 1px solid var(--mainwp-border);
1350 + padding-top: 0.9rem;
1351 + padding-bottom: 0.9rem;
1352 + margin: 0 !important;
1353 +}
1354 +
1355 +.mainwp-ui.mainwp-custom-theme #mainwp-second-level-navigation .ui.inverted.menu .item .item {
562 1356 font-weight: 400;
1357 + margin-right: 0.9rem;
1358 + margin-left: 0.9rem;
1359 + font-size: 0.85rem !important;
1360 + padding: 0.85rem !important;
563 1361 }
564 1362
565 1363 .mainwp-ui.mainwp-custom-theme #mainwp-second-level-navigation .ui.inverted.menu .item .item.active,
566 1364 .mainwp-ui.mainwp-custom-theme #mainwp-second-level-navigation .ui.inverted.menu .item .item:hover {
567 - background-color: var( --accent ) !important;
568 - color: var( --grey-light-alt ) !important;
1365 + color: var(--mainwp-green) !important;
1366 + background-color: #6c980010 !important;
1367 + border-radius: 0.785rem !important;
1368 + -webkit-border-radius: 0.785rem !important;
569 1369 }
570 1370
571 -.mainwp-ui.mainwp-custom-theme .mainwp-main-mobile-navigation-container {
572 - background-color: var( --grey-dark-alt ) !important;
1371 +.mainwp-ui.mainwp-custom-theme #mainwp-second-level-navigation .ui.inverted.menu .item.extension-inactive,
1372 +.mainwp-ui.mainwp-custom-theme #mainwp-second-level-navigation .ui.inverted.menu .item.extension-inactive:hover,
1373 +.mainwp-ui.mainwp-custom-theme #mainwp-second-level-navigation .ui.inverted.menu .item.extension-inactive a,
1374 +.mainwp-ui.mainwp-custom-theme #mainwp-second-level-navigation .ui.inverted.menu .item.extension-inactive .title,
1375 +.mainwp-ui.mainwp-custom-theme #mainwp-second-level-navigation .ui.inverted.menu .item.extension-inactive .icon,
1376 +.mainwp-ui.mainwp-custom-theme #mainwp-second-level-navigation .ui.inverted.menu a.item.extension-inactive,
1377 +.mainwp-ui.mainwp-custom-theme #mainwp-second-level-navigation .ui.inverted.menu a.item.extension-inactive:hover {
1378 + color: var(--mainwp-text-disabled) !important;
573 1379 }
574 1380
575 -.mainwp-ui.mainwp-custom-theme .mainwp-main-mobile-navigation-container .item {
576 - background-color: var( --grey-dark-alt ) !important;
1381 +.mainwp-ui.mainwp-custom-theme #mainwp-second-level-navigation .ui.inverted.menu .item.extension-inactive:hover,
1382 +.mainwp-ui.mainwp-custom-theme #mainwp-second-level-navigation .ui.inverted.menu a.item.extension-inactive:hover {
1383 + background: none !important;
577 1384 }
578 1385
579 -.mainwp-ui.mainwp-custom-theme .mainwp-main-mobile-navigation-container .item a {
580 - color: #fff !important;
1386 +.mainwp-ui.mainwp-custom-theme #mainwp-main-mobile-navigation-container {
1387 + background-color: var(--mainwp-base-background-secondary) !important;
581 1388 }
582 1389
583 -.mainwp-ui.mainwp-custom-theme #mainwp-main-menu {
584 - background-color: var( --grey-dark-alt ) !important;
1390 +.mainwp-ui.mainwp-custom-theme #mainwp-main-mobile-navigation-container .item {
1391 + background-color: var(--mainwp-element-background) !important;
585 1392 }
586 1393
1394 +.mainwp-ui.mainwp-custom-theme #mainwp-main-mobile-navigation-container .item a {
1395 + color: var(--mainwp-text) !important;
1396 +}
587 1397
1398 +.mainwp-ui.mainwp-custom-theme #mainwp-main-mobile-navigation-container #mainwp-main-menu {
1399 + background-color: var(--mainwp-element-background) !important;
1400 +}
588 1401
1402 +.mainwp-ui.mainwp-custom-theme #mainwp-main-mobile-navigation-container #mainwp-main-menu .item {
1403 + padding: var(--mainwp-area-padding) 0.5rem !important;
1404 + background-color: var(--mainwp-element-background) !important;
1405 +}
1406 +
1407 +.mainwp-ui.mainwp-custom-theme #mainwp-main-mobile-navigation-container #mainwp-main-menu .item .menu .item {
1408 + padding: 1rem 2rem !important;
1409 +}
1410 +
1411 +.mainwp-ui.mainwp-custom-theme #mainwp-main-mobile-navigation-container #mainwp-main-menu .item .item .menu.active .item,
1412 +.mainwp-ui.mainwp-custom-theme #mainwp-main-mobile-navigation-container #mainwp-main-menu .item .item .menu.active .item.title,
1413 +.mainwp-ui.mainwp-custom-theme #mainwp-main-mobile-navigation-container #mainwp-main-menu .item .item .menu.active .item.content {
1414 + background-color: #6c980012 !important;
1415 +}
1416 +
589 1417 /* Page Navigation
590 1418 ========================================================================== */
591 1419
592 1420 .mainwp-ui.mainwp-custom-theme #mainwp-page-navigation-wrapper {
593 - background-color: #fff;
594 - padding: 0 !important;
595 - border-right: 2px solid #E7EEF6;
596 - box-shadow: 2px 0 0 0 rgba(0,0,0,0.1) !important;
597 - }
1421 + background-color: var(--mainwp-element-background-secondary) !important;
1422 + border-left: 1px solid var(--mainwp-border);
1423 + border-right: 1px solid var(--mainwp-element-background-secondary);
1424 + box-shadow: none !important;
1425 + -webkit-box-shadow: none !important;
1426 + border-radius: var(--area-radius) 0 0 var(--area-radius) !important;
1427 +}
598 1428
599 1429 .mainwp-ui.mainwp-custom-theme #mainwp-page-navigation-wrapper .menu {
600 - margin-bottom: 0px !important;
601 - border-top: 0px solid var( --grey-light-alt ) !important;
602 - border-bottom: 1px solid var( --grey-light-alt ) !important;
603 - border-left: 1px solid var( --grey-light-alt ) !important;
604 - border-right: 1px solid var( --grey-light-alt ) !important;
1430 + background-color: var(--mainwp-element-background-secondary) !important;
1431 + padding: 1em !important;
1432 + width: 198px !important;
605 1433 }
606 1434 .mainwp-ui.mainwp-custom-theme #mainwp-page-navigation-wrapper .menu .item {
607 - padding: .7em 1.15em !important;
608 - color: var( --font-color ) !important;
1435 + color: var(--mainwp-text-secondary) !important;
1436 + background-color: var(--mainwp-element-background-secondary) !important;
1437 + font-size: 0.9em;
1438 + font-weight: 300;
609 1439 }
1440 +.mainwp-ui.mainwp-custom-theme #mainwp-page-navigation-wrapper .menu .item.active {
1441 + color: var(--mainwp-green) !important;
1442 + background-color: #6c980012 !important;
1443 + border-radius: 0.785rem !important;
1444 + -webkit-border-radius: 0.785rem !important;
1445 +}
610 1446
611 -.mainwp-ui.mainwp-custom-theme #mainwp-collapse-second-level-navigation {
612 - background-color: var( --grey-dark-alt ) !important;
1447 +.mainwp-ui.mainwp-custom-theme #mainwp-page-navigation-wrapper .menu .item::before {
1448 + background: none !important;
613 1449 }
614 1450
615 -.mainwp-ui.mainwp-custom-theme #mainwp-page-navigation-wrapper .menu .item.active,
616 -.mainwp-ui.mainwp-custom-theme #mainwp-page-navigation-wrapper .menu .item:hover {
617 - background-color: var( --grey-light );
1451 +.mainwp-ui.mainwp-custom-theme #mainwp-page-navigation-wrapper #mainwp-site-preview-image {
1452 + border-radius: var(--area-radius) 0 0 0 !important;
618 1453 }
619 1454
620 1455 .mainwp-ui.mainwp-custom-theme .menu .item#mainwp-collapse-fourth-level-navigation {
621 - background-color: #fff !important;
1456 + background-color: var(--mainwp-element-background-secondary);
622 1457 padding: 7px 4px 7px 2px !important;
623 1458 border-radius: 0 8px 8px 0 !important;
624 1459 min-width: auto !important;
625 - border-right: 1px solid #E7EEF6 !important;
626 - border-top: 1px solid #E7EEF6 !important;
627 - border-bottom: 1px solid #E7EEF6 !important;
628 - border-left: 1px solid #fff !important;
1460 + border-right: 1px solid var(--mainwp-border) !important;
1461 + border-top: 1px solid var(--mainwp-border) !important;
1462 + border-bottom: 1px solid var(--mainwp-border) !important;
1463 + border-left: 1px solid var(--mainwp-border) !important;
629 1464 z-index: 999999 !important;
630 1465 }
1466 +
631 1467 .mainwp-ui.mainwp-custom-theme .menu .item#mainwp-collapse-fourth-level-navigation:before {
632 1468 height: 0px !important;
633 1469 }
634 1470
635 1471 .mainwp-ui.mainwp-custom-theme .ui.inverted.menu.mainwp-sub-submenu {
636 - background-color: var( --grey-dark );
1472 + background-color: var(--mainwp-tab-bar-background) !important;
1473 + border-radius: 0px !important;
637 1474 }
638 1475
1476 +.mainwp-ui.mainwp-custom-theme .ui.inverted.menu.mainwp-sub-submenu,
1477 +.mainwp-ui.mainwp-custom-theme .ui.inverted.menu.mainwp-sub-submenu .item {
1478 + box-shadow: none !important;
1479 + -webkit-box-shadow: none !important;
1480 +}
1481 +
639 1482 .mainwp-ui.mainwp-custom-theme .ui.inverted.menu.mainwp-sub-submenu .item,
640 1483 .mainwp-ui.mainwp-custom-theme .ui.inverted.menu.mainwp-sub-submenu .item i {
641 - color: #ffffff !important;
1484 + color: var(--mainwp-text) !important;
642 1485 font-weight: normal !important;
643 1486 }
644 1487
645 1488 .mainwp-ui.mainwp-custom-theme .ui.inverted.menu.mainwp-sub-submenu .item:hover,
@@ -644,27 +1487,96 @@
644 1487
645 1488 .mainwp-ui.mainwp-custom-theme .ui.inverted.menu.mainwp-sub-submenu .item:hover,
646 1489 .mainwp-ui.mainwp-custom-theme .ui.inverted.menu.mainwp-sub-submenu .item.active {
647 1490 color: #ffffff !important;
648 - background-color: var( --accent );
1491 + background-color: var(--mainwp-blue);
1492 + border-radius: 0px !important;
649 1493 }
650 1494
651 -.mainwp-ui.mainwp-custom-theme .ui.inverted.pointing.menu .item {
652 - color: #ffffff !important;
653 - background-color: var( --grey-dark );
1495 +.mainwp-ui.mainwp-custom-theme .ui.secondary.pointing.menu:not(.inverted) {
1496 + border-color: var(--mainwp-border) !important;
654 1497 }
655 1498
656 -.mainwp-ui.mainwp-custom-theme .ui.inverted.pointing.menu .item .icon {
657 - color: #ffffff !important;
1499 +.mainwp-ui.mainwp-custom-theme .ui.secondary.pointing.menu:not(.inverted) .right.menu .item {
1500 + border-color: rgba(0,0,0,0) !important;
658 1501 }
659 1502
1503 +.mainwp-ui.mainwp-custom-theme .ui.inverted.pointing.menu .item {
1504 + color: var(--mainwp-text) !important;
1505 + background-color: var(--mainwp-element-background);
1506 +}
1507 +
1508 +.mainwp-ui.mainwp-custom-theme .ui.inverted.pointing.menu .item .icon {
1509 + color: var(--mainwp-text) !important;
1510 +}
1511 +
660 1512 .mainwp-ui.mainwp-custom-theme #mainwp-groups-menu.ui.pointing.vertical.menu .item:after {
661 1513 display: none !important;
662 1514 }
663 1515
1516 +.mainwp-ui.mainwp-custom-theme .ui.pointing.vertical.menu {
1517 + background-color: var(--mainwp-element-background);
1518 + border-color: var(--mainwp-border) !important;
1519 +}
1520 +
1521 +.mainwp-ui.mainwp-custom-theme .ui.pointing.secondary.menu .item,
1522 +.mainwp-ui.mainwp-custom-theme .ui.pointing.vertical.menu .item {
1523 + border-color: var(--mainwp-border);
1524 + color: var(--mainwp-text);
1525 +}
1526 +
1527 +.mainwp-ui.mainwp-custom-theme .ui.pointing.vertical.menu .item:hover {
1528 + background-color: var(--mainwp-element-background-secondary);
1529 +}
1530 +.mainwp-ui.mainwp-custom-theme .ui.pointing.secondary.menu .item.active {
1531 + border-color: var(--mainwp-green);
1532 + color: var(--mainwp-green);
1533 +}
1534 +.mainwp-ui.mainwp-custom-theme .ui.pointing.vertical.menu .item.active {
1535 + border-color: var(--mainwp-border);
1536 + background-color: var(--mainwp-element-background-secondary);
1537 + color: var(--mainwp-text);
1538 +}
1539 +
1540 +.mainwp-ui.mainwp-custom-theme .ui.pointing.vertical.menu .item:after {
1541 + display: none !important;
1542 +}
1543 +
1544 +.mainwp-ui.mainwp-custom-theme #mainwp-select-sites-menu .item {
1545 + color: var(--mainwp-text) !important;
1546 +}
1547 +.mainwp-ui.mainwp-custom-theme #mainwp-select-sites-menu .item:hover,
1548 +.mainwp-ui.mainwp-custom-theme #mainwp-select-sites-menu .item.active {
1549 + color: var(--mainwp-green) !important;
1550 + background-color: #6c980012 !important;
1551 +}
1552 +
1553 +/* UI Menus and Tabs
1554 + ========================================================================== */
1555 +
1556 + .mainwp-ui.mainwp-custom-theme .ui.tabular.menu {
1557 + border-color: var(--mainwp-border) !important;
1558 + }
1559 +
1560 + .mainwp-ui.mainwp-custom-theme .ui.tabular.menu:not(.pointing) .item {
1561 + background-color: var(--mainwp-element-background) !important;
1562 + color: var(--mainwp-text) !important;
1563 + }
1564 +
1565 + .mainwp-ui.mainwp-custom-theme .ui.tabular.menu:not(.pointing) .active.item {
1566 + background-color: var(--mainwp-element-background) !important;
1567 + color: var(--mainwp-text) !important;
1568 + border-color: var(--mainwp-border) !important;
1569 + }
1570 +
1571 + .mainwp-ui.mainwp-custom-theme .ui.attached.tab.segment {
1572 + border-color: var(--mainwp-border) !important;
1573 + }
1574 +
664 1575 /* Main Content Area
665 1576 ========================================================================== */
666 1577
1578 +body.mainwp-ui.mainwp-custom-theme.pushable > .pusher,
667 1579 body.mainwp-ui.mainwp-custom-theme,
668 1580 .mainwp-ui.mainwp-custom-theme #wpwrap,
669 1581 .mainwp-ui.mainwp-custom-theme #wpbody-content,
670 1582 .mainwp-ui.mainwp-custom-theme .ui.segment:not(.mainwp-widget),
@@ -669,74 +1581,265 @@
669 1581 .mainwp-ui.mainwp-custom-theme #wpbody-content,
670 1582 .mainwp-ui.mainwp-custom-theme .ui.segment:not(.mainwp-widget),
671 1583 .mainwp-ui.mainwp-custom-theme .mainwp-ui-leftmenu .mainwp-content-wrap,
672 1584 .mainwp-ui.mainwp-custom-theme .mainwp-primary-content-wrap {
673 - background-color: var( --grey-light ) !important;
674 - color: var( --font-color );
1585 + background-color: var(--mainwp-base-background) !important;
1586 + color: var(--mainwp-text);
675 1587 }
676 1588
1589 +.mainwp-ui.mainwp-custom-theme.mainwp-ui-leftmenu #wpwrap::before {
1590 + content: "";
1591 + position: fixed;
1592 + top: 58px;
1593 + right: 0;
1594 + bottom: 0;
1595 + left: 72px;
1596 + z-index: 1003;
1597 + pointer-events: none;
1598 + border-radius: var(--area-radius) 0 0 0;
1599 + -webkit-border-radius: var(--area-radius) 0 0 0;
1600 + box-shadow: -2px -2px 7px -5px rgba(17, 24, 39, 0.2);
1601 + -webkit-box-shadow: -2px -2px 7px -5px rgba(17, 24, 39, 0.2);
1602 +}
1603 +
1604 +.mainwp-ui.mainwp-custom-theme .ui.padded.segment {
1605 + padding: 2em !important;
1606 +}
1607 +
1608 +.mainwp-ui.mainwp-custom-theme .ui.secondary.segment:not(.mainwp-widget) {
1609 + background-color: var(--mainwp-element-background-secondary) !important;
1610 + border-radius: 0.28571429rem;
1611 + -webkit-border-radius: 0.28571429rem;
1612 +}
1613 +
677 1614 .mainwp-ui.mainwp-custom-theme .mainwp-main-content {
678 - border-right: 1px solid var( --grey-light-alt ) !important;
1615 + border-right: 1px solid var(--mainwp-border) !important;
679 1616 }
680 1617
681 1618 .mainwp-ui.mainwp-custom-theme .mainwp-sidebar-left .mainwp-main-content {
682 - border-left: 1px solid var( --grey-light-alt ) !important;
1619 + border-left: 1px solid var(--mainwp-border) !important;
683 1620 }
684 1621
685 -.mainwp-ui.mainwp-custom-theme .mainwp-primary-content-wrap .mainwp-widget.segment {
686 - border: 1px solid #ffffff !important;
687 - border-radius: 10px;
688 - -webkit-border-radius: 10px;
689 - box-shadow: 0 1px 2px 0 rgba( 0, 0, 0, .1 );
1622 +.mainwp-ui.mainwp-custom-theme .mainwp-widget.segment {
1623 + background-color: var(--mainwp-element-background) !important;
1624 + border: 1px solid var(--mainwp-border) !important;
1625 + border-radius: var(--area-radius);
1626 + -webkit-border-radius: var(--area-radius);
1627 + box-shadow: none;
690 1628 }
691 1629
1630 +.mainwp-ui.mainwp-custom-theme #mainwp-module-cost-tracker-settings-tab,
1631 +.mainwp-ui.mainwp-custom-theme #mainwp-site-mode-wrap {
1632 + width: calc(100% - 200px);
1633 +}
692 1634
693 1635 /* Side Content Area
694 1636 ========================================================================== */
695 1637 .mainwp-ui.mainwp-custom-theme .mainwp-side-content {
696 - background-color: #ffffff !important;
697 - min-height: 100vh;
698 - color: var( --font-color );
699 - border-left: 1px solid var( --grey-light-alt ) !important;
700 - border-right: 1px solid var( --grey-light-alt ) !important;
701 - border-bottom: none !important;
1638 + padding: 0px !important;
1639 + background-color: var(--mainwp-base-background) !important;
1640 + color: var(--mainwp-text);
1641 + min-height: calc(100vh - 68px);
1642 + border-left: 1px solid var(--mainwp-border);
702 1643 }
703 1644
704 -.mainwp-ui.mainwp-custom-theme .mainwp-side-content #mainwp-select-sites-select-all-actions {
705 - background-color: var( --grey-light-alt ) !important;
706 - border-bottom: 1px solid var( --grey-light-alt ) !important;
1645 +.mainwp-ui.mainwp-custom-theme .mainwp-sidebar-options {
1646 + background-color: var(--mainwp-base-background) !important;
707 1647 }
708 1648
1649 +.mainwp-ui.mainwp-custom-theme .mainwp-side-content .ui.accordion .title,
1650 +.mainwp-ui.mainwp-custom-theme .mainwp-side-content .ui.accordion .content {
1651 + background: none !important;
1652 +}
1653 +
709 1654 /* Header Element
710 1655 ========================================================================== */
711 1656
712 -.mainwp-ui.mainwp-custom-theme #mainwp-top-header {
713 - border-bottom: 1px solid var( --grey-light-alt ) !important;
1657 +.mainwp-ui.mainwp-custom-theme #mainwp-top-header {
1658 + background: var(--mainwp-shell-background);
1659 + box-shadow: none;
1660 +}
1661 +
1662 +.mainwp-ui.mainwp-custom-theme #mainwp-header-layout-actions {
1663 + padding: 7px 0 7px 10px;
1664 + margin-left: 10px;
1665 + border-left: 1px solid var(--mainwp-border) !important;
1666 +}
1667 +
1668 +.mainwp-ui.mainwp-custom-theme #mainwp-header-command-palette-actions {
1669 + border-right-color: var(--mainwp-border) !important;
1670 +}
1671 +
1672 +.mainwp-ui.mainwp-custom-theme #mainwp-header-secondary-actions {
1673 + padding: 7px 10px;
1674 + margin: 0 10px;
1675 + border-left: 1px solid var(--mainwp-border) !important;
1676 + border-right: 1px solid var(--mainwp-border) !important;
1677 +}
1678 +
1679 +.mainwp-ui.mainwp-custom-theme #mainwp-top-header .ui.button {
1680 + font-size: 0.85714286rem !important;
1681 +}
1682 +
1683 +.mainwp-ui.mainwp-custom-theme #mainwp-command-palette-trigger {
1684 + background: transparent !important;
1685 + border-color: var(--mainwp-border) !important;
1686 + color: var(--mainwp-text) !important;
1687 +}
1688 +
1689 +.mainwp-ui.mainwp-custom-theme #mainwp-command-palette-trigger kbd {
1690 + color: inherit !important;
1691 +}
1692 +
1693 +.mainwp-ui.mainwp-custom-theme .components-modal__frame.commands-command-menu,
1694 +.mainwp-ui.mainwp-custom-theme .commands-command-menu {
1695 + border-radius: var(--area-radius) !important;
1696 + overflow: hidden !important;
1697 +}
1698 +
1699 +.mainwp-ui.mainwp-custom-theme #mainwp-top-header .ui.icon.button:not(.red, .green) {
1700 + background: none !important;
1701 + color: var(--mainwp-text) !important;
1702 + margin: 0px 2px !important;
1703 +}
1704 +
1705 +.mainwp-ui.mainwp-custom-theme #mainwp-top-header .ui.icon.button:not(.red, .green):hover {
1706 + background-color: var(--mainwp-shell-background-hover) !important;
714 1707 }
715 1708
716 -.mainwp-ui.mainwp-custom-theme .mainwp-sub-header {
717 - background-color: #ffffff;
718 - border-bottom: 1px solid var( --grey-light-alt ) !important;
719 - padding-top: 17px;
720 - padding-bottom: 17px;
1709 +.mainwp-ui.mainwp-custom-theme #mainwp-top-header .mainwp-page-title {
1710 + color: var(--mainwp-text-header);
721 1711 }
722 1712
1713 +.mainwp-ui.mainwp-custom-theme .mainwp-sub-header,
723 1714 .mainwp-ui.mainwp-custom-theme .mainwp-actions-bar {
724 - background-color: var( --grey-light ) !important;
725 - border-bottom: 1px solid var( --grey-light-alt ) !important;
1715 + background-color: var(--mainwp-element-background);
1716 + border: 1px solid var(--mainwp-border) !important;
1717 + padding: var(--mainwp-area-padding) !important;
1718 + margin-left: 2em !important;
1719 + margin-right: 2em !important;
1720 + border-radius: var(--area-radius) !important;
1721 + -webkit-border-radius: var(--area-radius) !important;
726 1722 }
727 1723
1724 +.mainwp-ui.mainwp-custom-theme .mainwp-actions-bar {
1725 + margin-top: 2em !important;
1726 +}
728 1727
1728 +.mainwp-ui.mainwp-custom-theme .mainwp-sub-header {
1729 + margin-top: calc( 58px + 2em ) !important;
1730 +}
1731 +
1732 +.mainwp-ui.mainwp-custom-theme.mainwp-individual-site-view .mainwp-sub-header {
1733 + margin-top: 0em !important;
1734 +}
1735 +.mainwp-ui.mainwp-custom-theme #mainwp-themes-content .ui.secondary.segment,
729 1736 .mainwp-ui.mainwp-custom-theme #mainwp-plugins-content .ui.secondary.segment {
730 - background-color: var( --grey-light-alt ) !important;
731 - padding: 20px;
1737 + background-color: var(--mainwp-element-background) !important;
1738 + padding: var(--mainwp-area-padding);
732 1739 margin-bottom: 0px;
1740 + border-bottom: 1px solid var(--mainwp-border) !important;
733 1741 }
734 1742
1743 +/* Invert Dimmer and Loader */
1744 +
1745 +.mainwp-ui.mainwp-custom-theme .ui.dimmer:not(.modals),
1746 +.mainwp-ui.mainwp-custom-theme .ui.inverted.dimmer:not(.modals) {
1747 + background-color: var(--mainwp-element-background-secondary) !important;
1748 +}
1749 +
1750 +.mainwp-ui.mainwp-custom-theme .ui.dimmer:not(.modals) > .ui.text.loader,
1751 +.mainwp-ui.mainwp-custom-theme .ui.inverted.dimmer:not(.modals) > .ui.text.loader {
1752 + color: var(--mainwp-text-header) !important;
1753 +}
1754 +
1755 +.mainwp-ui.mainwp-custom-theme .ui.dimmer.modals,
1756 +.mainwp-ui.mainwp-custom-theme .ui.inverted.dimmer.modals {
1757 + background-color: rgba(32, 36, 39, 0.32) !important;
1758 + backdrop-filter: blur(5px) !important;
1759 +}
1760 +
1761 +.mainwp-ui.mainwp-custom-theme .ui.extension.card .ui.dimmer,
1762 +.mainwp-ui.mainwp-custom-theme .ui.extension.card .ui.inverted.dimmer {
1763 + background-color: rgba(32, 36, 39, 0.32) !important;
1764 + backdrop-filter: blur(5px) !important;
1765 + border-radius: var(--area-radius) !important;
1766 +}
1767 +
1768 +.mainwp-ui.mainwp-custom-theme .ui.extension.card .ui.dimmer > .ui.text.loader,
1769 +.mainwp-ui.mainwp-custom-theme .ui.extension.card .ui.inverted.dimmer > .ui.text.loader {
1770 + color: #ffffff !important;
1771 +}
1772 +
1773 +.mainwp-ui.mainwp-custom-theme .ui.loader:after {
1774 + color: var(--mainwp-green) !important;
1775 +}
1776 +
1777 +#mainwp-posting-running,
1778 +#mainwp-publish-dimmer {
1779 + height: 100vh;
1780 + width: 100% !important
1781 +}
1782 +
1783 +/* Flyout */
1784 +.mainwp-ui.mainwp-custom-theme .ui.flyout {
1785 + background-color: var(--mainwp-element-background) !important;
1786 +}
1787 +.mainwp-ui.mainwp-custom-theme .ui.flyout .content,
1788 +.mainwp-ui.mainwp-custom-theme .ui.flyout .actions,
1789 +.mainwp-ui.mainwp-custom-theme .ui.flyout .header {
1790 + background-color: var(--mainwp-element-background) !important;
1791 +}
1792 +
1793 +/* Accordion */
1794 +
1795 +.mainwp-ui.mainwp-custom-theme .ui.accordion {
1796 + background: var(--mainwp-base-background) !important;
1797 +}
1798 +
1799 +.mainwp-ui.mainwp-custom-theme .ui.styled.accordion {
1800 + background: var(--mainwp-element-background) !important;
1801 +}
1802 +
1803 +.mainwp-ui.mainwp-custom-theme .ui.accordion .title,
1804 +.mainwp-ui.mainwp-custom-theme .ui.accordion .content {
1805 + color: var(--mainwp-text);
1806 + border-color: var(--mainwp-border) !important;
1807 + background: var(--mainwp-element-background) !important;
1808 +}
1809 +
1810 +.mainwp-ui.mainwp-custom-theme .ui.accordion.mainwp-manage-plugin-accordion,
1811 +.mainwp-ui.mainwp-custom-theme .ui.accordion.mainwp-manage-plugin-accordion .title,
1812 +.mainwp-ui.mainwp-custom-theme .ui.accordion.mainwp-manage-plugin-accordion .content,
1813 +.mainwp-ui.mainwp-custom-theme .ui.accordion.mainwp-manage-theme-accordion,
1814 +.mainwp-ui.mainwp-custom-theme .ui.accordion.mainwp-manage-theme-accordion .title,
1815 +.mainwp-ui.mainwp-custom-theme .ui.accordion.mainwp-manage-theme-accordion .content {
1816 + background: var(--mainwp-element-background) !important;
1817 +}
1818 +
1819 +.mainwp-ui.mainwp-custom-theme .ui.accordion.mainwp-blank-accordion .title,
1820 +.mainwp-ui.mainwp-custom-theme .ui.accordion.mainwp-blank-accordion .content {
1821 + background: none !important;
1822 +}
1823 +
1824 +.mainwp-ui.mainwp-custom-theme .ui.accordion .title:hover {
1825 + color: var(--mainwp-text) !important;
1826 +}
1827 +
1828 +.mainwp-ui.mainwp-custom-theme .ui.accordion .content.active label {
1829 + color: var(--mainwp-text) !important;
1830 +}
1831 +
1832 +.mainwp-ui.mainwp-custom-theme .mainwp-manage-plugin-item-website,
1833 +.mainwp-ui.mainwp-custom-theme .mainwp-manage-theme-item-website {
1834 + background-color: var(--mainwp-element-background-secondary) !important;
1835 +}
1836 +
735 1837 .mainwp-ui.mainwp-custom-theme .ui.accordion.mainwp-manage-plugin-item,
736 -.mainwp-ui.mainwp-custom-theme .ui.accordion.mainwp-manage-theme-item{
737 - background: #ffffff;
738 - padding: 10px;
1838 +.mainwp-ui.mainwp-custom-theme .ui.accordion.mainwp-manage-theme-item {
1839 + background: var(--mainwp-element-background);
1840 + padding: var(--mainwp-area-padding);
1841 + border-bottom: 1px solid var(--mainwp-border) !important;
739 1842 }
740 1843
741 1844 .mainwp-ui.mainwp-custom-theme .ui.accordion.mainwp-manage-plugin-item .title.active,
742 1845 .mainwp-ui.mainwp-custom-theme .ui.accordion.mainwp-manage-plugin-item .content.active,
@@ -741,50 +1844,465 @@
741 1844 .mainwp-ui.mainwp-custom-theme .ui.accordion.mainwp-manage-plugin-item .title.active,
742 1845 .mainwp-ui.mainwp-custom-theme .ui.accordion.mainwp-manage-plugin-item .content.active,
743 1846 .mainwp-ui.mainwp-custom-theme .ui.accordion.mainwp-manage-theme-item .title.active,
744 1847 .mainwp-ui.mainwp-custom-theme .ui.accordion.mainwp-manage-theme-item .content.active {
745 - background-color: #ffffff;
1848 + background-color: var(--mainwp-element-background-secondary);
746 1849 }
747 1850
748 1851 .mainwp-ui.mainwp-custom-theme .ui.accordion.mainwp-manage-plugin-item .content.active .ui.grid,
749 1852 .mainwp-ui.mainwp-custom-theme .ui.accordion.mainwp-manage-theme-item .content.active .ui.grid {
750 - background-color: var( --grey-light );
751 - border-color: var( --grey-light-alt );
1853 + background-color: var(--mainwp-element-background-secondary);
1854 + border-color: var(--mainwp-border);
752 1855 }
753 1856
754 -.mainwp-ui.mainwp-custom-theme #mainwp-manage-updates table tr.active {
755 - background-color: var( --grey-light ) !important;
1857 +.mainwp-ui.mainwp-custom-theme .ui.accordion#mainwp-connection-authentication-accordion .title,
1858 +.mainwp-ui.mainwp-custom-theme .ui.accordion#mainwp-connection-authentication-accordion .content,
1859 +.mainwp-ui.mainwp-custom-theme #mainwp-article-uploader-import .ui.accordion .title,
1860 +.mainwp-ui.mainwp-custom-theme #mainwp-article-uploader-import .ui.accordion .content {
1861 + background: none !important;
756 1862 }
757 1863
758 -.mainwp-ui.mainwp-custom-theme #mainwp-manage-updates table tr.active table th {
759 - background-color: var( --grey-light-alt ) !important;
1864 +.mainwp-ui.mainwp-custom-theme #mainwp-manage-updates table tr.active {
1865 + background-color: var(--mainwp-element-background-secondary) !important;
760 1866 }
761 1867
1868 +.mainwp-ui.mainwp-custom-theme #mainwp-manage-updates table tr.active table th,
762 1869 .mainwp-ui.mainwp-custom-theme #mainwp-manage-updates table tr.active table td {
763 - background-color: #7fb10007 !important;
1870 + background-color: var(--mainwp-element-background-secondary) !important;
764 1871 }
765 1872
1873 +
1874 +
766 1875 .mainwp-ui.mainwp-custom-theme #mainwp-sites-filters-row {
767 - border-top: 1px solid var( --grey-light-alt ) !important;
1876 + border-top: 1px solid var(--mainwp-border) !important;
768 1877 }
769 1878
1879 +.mainwp-ui.mainwp-custom-theme #mainwp-sites-sidebar-menu.ui.vertical.menu {
1880 + background-color: var(--mainwp-element-background);
1881 +}
1882 +
1883 +.mainwp-ui.mainwp-custom-theme #mainwp-sites-sidebar-menu.ui.vertical.menu .item {
1884 + border-bottom: 1px solid var(--mainwp-border) !important;
1885 +}
1886 +
1887 +.mainwp-ui.mainwp-custom-theme #mainwp-sites-sidebar-menu.ui.vertical.menu .item:last-child {
1888 + border-bottom: none !important;
1889 +}
1890 +
1891 +.mainwp-ui.mainwp-custom-theme #mainwp-sites-sidebar-menu.ui.vertical.menu .item a .label,
1892 +.mainwp-ui.mainwp-custom-theme #mainwp-sites-sidebar-menu.ui.vertical.menu .item a,
1893 +.mainwp-ui.mainwp-custom-theme #mainwp-sites-sidebar-menu.ui.vertical.menu .item .icon {
1894 + color: var(--mainwp-text) !important;
1895 +}
1896 +
1897 +.mainwp-ui.mainwp-custom-theme #mainwp-sites-sidebar-menu.ui.vertical.menu .item.active {
1898 + border-color: var(--mainwp-border);
1899 + background-color: #6c980012 !important;
1900 + color: var(--mainwp-text) !important;
1901 +}
1902 +
1903 +.mainwp-ui.mainwp-custom-theme #mainwp-sites-sidebar-menu.ui.vertical.menu .item:after {
1904 + display: none !important;
1905 +}
1906 +
1907 +.mainwp-ui.mainwp-custom-theme #mainwp-sites-sidebar-menu.ui.accordion .title,
1908 +.mainwp-ui.mainwp-custom-theme #mainwp-sites-sidebar-menu.ui.accordion .content {
1909 + background: none !important;
1910 +}
1911 +
1912 +/* Grids
1913 + ========================================================================== */
1914 +
1915 + .mainwp-ui.mainwp-custom-theme .ui.celled.grid {
1916 + box-shadow: 0 0 0 1px var(--mainwp-border) !important;
1917 + }
1918 +
1919 + .mainwp-ui.mainwp-custom-theme .ui.celled.grid > .row {
1920 + box-shadow: 0 -1px 0 0 var(--mainwp-border) !important;
1921 + }
1922 +
1923 + .mainwp-ui.mainwp-custom-theme .ui.celled.grid > .column:not(.row),
1924 + .mainwp-ui.mainwp-custom-theme .ui.celled.grid > .row > .column {
1925 + box-shadow: -1px 0 0 0 var(--mainwp-border) !important;
1926 + }
1927 +
1928 +/* Steps
1929 +========================================================================== */
1930 +.mainwp-ui.mainwp-custom-theme .ui.steps:not(.vertical) .step {
1931 + background-color: var(--mainwp-element-background) !important;
1932 + border-right: 1px solid var(--mainwp-border) !important;
1933 +}
1934 +.mainwp-ui.mainwp-custom-theme .ui.steps:not(.vertical) .step.active {
1935 + background-color: var(--mainwp-green) !important;
1936 +}
1937 +.mainwp-ui.mainwp-custom-theme .ui.steps:not(.vertical) .step.completed {
1938 + background-color: var(--mainwp-green) !important;
1939 +}
1940 +.mainwp-ui.mainwp-custom-theme .ui.steps:not(.vertical) .step:after {
1941 + background-color: var(--mainwp-element-background) !important;
1942 + border-color: var(--mainwp-border) !important;
1943 +}
1944 +.mainwp-ui.mainwp-custom-theme .ui.circular.steps .step::before {
1945 + border-color: var(--mainwp-border) !important;
1946 +}
1947 +.mainwp-ui.mainwp-custom-theme .ui.circular.steps .step.active::before,
1948 +.mainwp-ui.mainwp-custom-theme .ui.circular.steps .step.completed::before {
1949 + border-color: var(--mainwp-green) !important;
1950 +}
1951 +.mainwp-ui.mainwp-custom-theme .ui.steps .step.active:after {
1952 + background-color: var(--mainwp-green) !important;
1953 +}
1954 +.mainwp-ui.mainwp-custom-theme .ui.circular.steps .step:after {
1955 + background: none !important;
1956 +}
1957 +.mainwp-ui.mainwp-custom-theme .ui.circular.ordered.steps .step.active::before,
1958 +.mainwp-ui.mainwp-custom-theme .ui.circular.steps .step.active:after {
1959 + color: var(--mainwp-green) !important;
1960 +}
1961 +.mainwp-ui.mainwp-custom-theme .ui.steps .step .title,
1962 +.mainwp-ui.mainwp-custom-theme .ui.steps .step .title .icon {
1963 + color: var(--mainwp-text-header) !important;
1964 +}
1965 +.mainwp-ui.mainwp-custom-theme .ui.steps .step.active .title,
1966 +.mainwp-ui.mainwp-custom-theme .ui.steps .step.completed .title {
1967 + color: #ffffff !important;
1968 +}
1969 +.mainwp-ui.mainwp-custom-theme .ui.steps .step .description {
1970 + color: var(--mainwp-text) !important;
1971 +}
1972 +
770 1973 /* Gridster Fixes
771 1974 ========================================================================== */
772 1975
773 - .mainwp-ui.mainwp-custom-theme .preview-holder {
774 - background-color: #ffffff;
775 - border: 4px var( --grey-darker-alt ) dashed;
776 - border-radius: 10px;
777 - -webkit-border-radius: 10px;
778 - }
1976 +.mainwp-ui.mainwp-custom-theme .preview-holder {
1977 + background-color: var(--mainwp-base-background-secondary);
1978 + border: 4px var(--mainwp-base-background-secondary) dashed;
1979 + border-radius: var(--area-radius);
1980 + -webkit-border-radius: var(--area-radius);
1981 +}
779 1982
780 1983 /* Custom Fixes
781 1984 ========================================================================== */
782 1985
783 1986 .mainwp-ui.mainwp-custom-theme #ngBulkSettingsManagerId {
784 - background-color: var( --grey-light ) !important;
1987 + background: var(--mainwp-element-background) !important;
1988 + background-color: var(--mainwp-element-background) !important;
785 1989 }
786 1990
787 1991 .mainwp-ui.mainwp-custom-theme #mainwp-test-connection-result {
788 - background-color: #ffffff !important;
1992 + background-color: var(--mainwp-base-background) !important;
789 1993 }
790 1994
1995 +.mainwp-ui.mainwp-custom-theme .itsec-notification-center-notification-settings {
1996 + border-color: var(--mainwp-border) !important;
1997 +}
1998 +
1999 +.mainwp-ui.mainwp-custom-theme #mainwp-jetpack-scan-threats-table .ui.white.segment,
2000 +.mainwp-ui.mainwp-custom-theme #mainwp-jetpack-protect-vulnerabilities-table .ui.white.segment {
2001 + background-color: var(--mainwp-element-background) !important;
2002 +}
2003 +
2004 +.mainwp-ui.mainwp-custom-theme #mainwp-sucuri-scan-modal .ui.segment,
2005 +.mainwp-ui.mainwp-custom-theme #mainwp-sucuri-scan-modal .ui.secondary.segment,
2006 +.mainwp-ui.mainwp-custom-theme #mainwp-time-tracker-view-task-modal .ui.segment,
2007 +.mainwp-ui.mainwp-custom-theme #mainwp-time-tracker-view-edit-task-modal .ui.segment {
2008 + background-color: var(--mainwp-element-background-secondary) !important;
2009 +}
2010 +
2011 +.mainwp-ui.mainwp-custom-theme #remote-storage-container input.labelauty + label {
2012 + background-color: var(--mainwp-element-background) !important;
2013 + border: 1px solid var(--mainwp-border) !important;
2014 + border-radius: var(--input-radius) !important;
2015 + color: var(--mainwp-text) !important;
2016 +}
2017 +
2018 +/*******************************
2019 + Scrollbars
2020 +*******************************/
2021 +
2022 +/* For WebKit Browsers (e.g., Chrome, Edge, Safari) */
2023 +::-webkit-scrollbar {
2024 + width: 5px; /* Width of the scrollbar */
2025 +}
2026 +
2027 +::-webkit-scrollbar-track {
2028 + background: var(--mainwp-element-background); /* Background of the track */
2029 +}
2030 +
2031 +::-webkit-scrollbar-thumb {
2032 + background-color: #b7b3aa; /* Color of the scrollbar thumb */
2033 + border-radius: 5px; /* Round edges for the thumb */
2034 + border: 2px solid var(--mainwp-element-background); /* Optional: creates padding between thumb and track */
2035 +}
2036 +
2037 +::-webkit-scrollbar-thumb:hover {
2038 + background: #969186; /* Thumb color on hover */
2039 +}
2040 +
2041 +/* For Firefox (using CSS Scrollbars Module Level 1) */
2042 +* {
2043 + scrollbar-width: thin; /* Options: auto, thin */
2044 + scrollbar-color: #b7b3aa var(--mainwp-element-background); /* thumb color, track color */
2045 +}
2046 +
2047 +/*******************************
2048 + DataTables
2049 +*******************************/
2050 +
2051 +.mainwp-ui.mainwp-custom-theme div.dt-container.dt-semanticUI div.dt-length .ui.selection.dropdown {
2052 + border-radius: 16px !important;
2053 + -webkit-border-radius: 16px !important;
2054 + font-size: 0.78571429em;
2055 + box-shadow: none !important;
2056 +}
2057 +.mainwp-ui.mainwp-custom-theme div.dt-container.dt-semanticUI div.dt-length .ui.selection.dropdown.active {
2058 + border-radius: 16px 16px 0 0 !important;
2059 + -webkit-border-radius: 16px 16px 0 0 !important;
2060 + box-shadow: none !important;
2061 + border-color: #96c8da !important;
2062 +}
2063 +.mainwp-ui.mainwp-custom-theme div.dt-container.dt-semanticUI div.dt-search span.input input {
2064 + border-radius: var(--button-radius) !important;
2065 + -webkit-border-radius: var(--button-radius) !important;
2066 + font-size: 0.78571429em;
2067 +}
2068 +.mainwp-ui.mainwp-custom-theme div.dt-container.dt-semanticUI div.dt-paging .ui.pagination.menu {
2069 + font-size: 0.78571429em;
2070 + box-shadow: none !important;
2071 + border-radius: var(--button-radius) !important;
2072 + -webkit-border-radius: var(--button-radius) !important;
2073 +}
2074 +
2075 +.mainwp-ui.mainwp-custom-theme div.dt-container.dt-semanticUI .row .center.aligned.sixteen.wide.column {
2076 + text-align: right;
2077 +}
2078 +
2079 +.mainwp-ui.mainwp-custom-theme table.dataTable thead > tr > th.dt-orderable-asc span.dt-column-order:before,
2080 +.mainwp-ui.mainwp-custom-theme table.dataTable thead > tr > th.dt-ordering-asc span.dt-column-order:before,
2081 +.mainwp-ui.mainwp-custom-theme table.dataTable thead > tr > td.dt-orderable-asc span.dt-column-order:before,
2082 +.mainwp-ui.mainwp-custom-theme table.dataTable thead > tr > td.dt-ordering-asc span.dt-column-order:before {
2083 + position: absolute;
2084 + display: block;
2085 + bottom: 50%;
2086 + content: "\f106";
2087 + content: "\f106"/"";
2088 + font-family: "icons", sans-serif;
2089 +}
2090 +.mainwp-ui.mainwp-custom-theme table.dataTable thead > tr > th.dt-orderable-desc span.dt-column-order:after,
2091 +.mainwp-ui.mainwp-custom-theme table.dataTable thead > tr > th.dt-ordering-desc span.dt-column-order:after,
2092 +.mainwp-ui.mainwp-custom-theme table.dataTable thead > tr > td.dt-orderable-desc span.dt-column-order:after,
2093 +.mainwp-ui.mainwp-custom-theme table.dataTable thead > tr > td.dt-ordering-desc span.dt-column-order:after {
2094 + position: absolute;
2095 + display: block;
2096 + top: 50%;
2097 + content: "\f107";
2098 + content: "\f107"/"";
2099 + font-family: "icons", sans-serif;
2100 +}
2101 +
2102 +.mainwp-ui.mainwp-custom-theme table.dataTable tr th:first-child,
2103 +.mainwp-ui.mainwp-custom-theme table.dataTable tr td:first-child {
2104 + border-left: none !important;
2105 +}
2106 +
2107 +.mainwp-ui.mainwp-custom-theme table.dataTable tr th:last-child,
2108 +.mainwp-ui.mainwp-custom-theme table.dataTable tr td:last-child {
2109 + border-right: none !important;
2110 +}
2111 +
2112 +.mainwp-ui.mainwp-custom-theme div.dt-container.dt-empty-footer tbody>tr:last-child>* {
2113 + border-bottom: none !important;
2114 +}
2115 +
2116 +/* WP Widget */
2117 +
2118 +.mainwp-ui.mainwp-custom-theme .widget-inside,
2119 +.mainwp-ui.mainwp-custom-theme .widget-top {
2120 + background: var(--mainwp-element-background);
2121 + border: 1px solid var(--mainwp-border);
2122 + color: var(--mainwp-text) !important;
2123 +}
2124 +
2125 +.mainwp-ui.mainwp-custom-theme .widget-inside select,
2126 +.mainwp-ui.mainwp-custom-theme .widget-top select {
2127 + background: var(--mainwp-element-background);
2128 + border: 1px solid var(--mainwp-border);
2129 + color: var(--mainwp-text) !important;
2130 +}
2131 +
2132 +
2133 +/* Buddy Support */
2134 +.mainwp-ui.mainwp-custom-theme .profile_box {
2135 + background: var(--mainwp-element-background);
2136 + border: 1px solid var(--mainwp-border);
2137 + color: var(--mainwp-text);
2138 + box-shadow: none !important;
2139 +}
2140 +
2141 +.mainwp-ui.mainwp-custom-theme .profile_box .bb-remote-checkbox {
2142 + border-top: 1px solid var(--mainwp-border);
2143 +}
2144 +
2145 +.mainwp-ui.mainwp-custom-theme .profile_item_select,
2146 +.mainwp-ui.mainwp-custom-theme .profile_item_noselect,
2147 +.mainwp-ui.mainwp-custom-theme .profile_settings {
2148 + background: var(--mainwp-element-background);
2149 + border: 1px solid var(--mainwp-border);
2150 +}
2151 +
2152 +.mainwp-ui.mainwp-custom-theme .form-table th {
2153 + color: var(--mainwp-text);
2154 +}
2155 +
2156 +
2157 +.mainwp-ui.mainwp-custom-theme .form-table td input,
2158 +.mainwp-ui.mainwp-custom-theme .form-table td select,
2159 +.mainwp-ui.mainwp-custom-theme .form-table td a.button {
2160 + background-color: var(--mainwp-element-background-secondary) !important;
2161 + color: var(--mainwp-text) !important;
2162 +}
2163 +
2164 +/* Apexcharts */
2165 +
2166 +.mainwp-ui.mainwp-custom-theme .apexcharts-menu {
2167 + background: var(--mainwp-element-background) !important;
2168 + border-color: var(--mainwp-border) !important;
2169 +}
2170 +
2171 +.mainwp-ui.mainwp-custom-theme .apexcharts-menu .apexcharts-menu-item:hover {
2172 + background: var(--mainwp-element-background-secondary) !important;
2173 +}
2174 +
2175 +.mainwp-ui.mainwp-custom-theme.mainwp_page_InsightsOverview .ui.segment.mainwp-widget {
2176 + color: var(--mainwp-text) !important;
2177 +}
2178 +
2179 +.mainwp-ui.mainwp-custom-theme .apexcharts-gridlines-horizontal,
2180 +.mainwp-ui.mainwp-custom-theme .apexcharts-grid-borders {
2181 + opacity: 0.2 !important;
2182 +}
2183 +
2184 +
2185 +/* Wordfence Support */
2186 +
2187 +.mainwp-ui.mainwp-custom-theme .wf-block {
2188 + background: var(--mainwp-element-background) !important;
2189 + border: 1px solid var(--mainwp-border);
2190 +}
2191 +
2192 +.mainwp-ui.mainwp-custom-theme .wf-scan-results {
2193 + border-color: var(--mainwp-border) !important;
2194 +}
2195 +
2196 +.mainwp-ui.mainwp-custom-theme .wf-scan-tabs {
2197 + box-shadow: none !important;
2198 +}
2199 +
2200 +.mainwp-ui.mainwp-custom-theme .wf-block-list li,
2201 +.mainwp-ui.mainwp-custom-theme #wf-scan-results-new {
2202 + border-color: var(--mainwp-border) !important;
2203 +}
2204 +
2205 +.mainwp-ui.mainwp-custom-theme .wf-scan-tabs li.wf-tab {
2206 + background-color: var(--mainwp-element-background) !important;
2207 + color: var(--mainwp-text) !important;
2208 + border: none !important;
2209 +}
2210 +
2211 +.mainwp-ui.mainwp-custom-theme #wf-scan-bulk-buttons-delete,
2212 +.mainwp-ui.mainwp-custom-theme #wf-scan-bulk-buttons-repair {
2213 + background-color: var(--mainwp-blue) !important;
2214 + color: #ffffff !important;
2215 + border: none !important;
2216 +}
2217 +
2218 +.mainwp-ui.mainwp-custom-theme .wf-scanner-progress>.wf-scan-step>.wf-scan-step-icon>.wf-scan-step-disabled,
2219 +.mainwp-ui.mainwp-custom-theme .wf-scanner-progress>.wf-scan-step>.wf-scan-step-icon>.wf-scan-step-premium,
2220 +.mainwp-ui.mainwp-custom-theme .wf-scanner-progress>.wf-scan-step>.wf-scan-step-icon>.wf-scan-step-pending,
2221 +.mainwp-ui.mainwp-custom-theme .wf-scanner-progress>.wf-scan-step>.wf-scan-step-icon>.wf-scan-step-running,
2222 +.mainwp-ui.mainwp-custom-theme .wf-scanner-progress>.wf-scan-step>.wf-scan-step-icon>.wf-scan-step-complete-success,
2223 +.mainwp-ui.mainwp-custom-theme .wf-scanner-progress>.wf-scan-step>.wf-scan-step-icon>.wf-scan-step-complete-warning {
2224 + background-color: var(--mainwp-element-background) !important;
2225 +}
2226 +
2227 +.mainwp-ui.mainwp-custom-theme .wf-scanner-progress>.wf-scan-step:first-of-type,
2228 +.mainwp-ui.mainwp-custom-theme .wf-scanner-progress>.wf-scan-step:last-of-type {
2229 + background: var(--mainwp-element-background) !important;
2230 +}
2231 +
2232 +.mainwp-ui.mainwp-custom-theme .wf-issue:nth-of-type(2n),
2233 +.mainwp-ui.mainwp-custom-theme .wf-issue-site-cleaning:nth-of-type(2n) {
2234 + background-color: var(--mainwp-element-background) !important;
2235 +}
2236 +
2237 +.mainwp-ui.mainwp-custom-theme .wf-issue,
2238 +#wf-scan-activity-log .wf-issue-site-cleaning {
2239 + border-color: var(--mainwp-border) !important;
2240 +}
2241 +
2242 +.mainwp-ui.mainwp-custom-theme #wf-scan-activity-log {
2243 + background-color: var(--mainwp-element-background) !important;
2244 +}
2245 +
2246 +.mainwp-ui.mainwp-custom-theme #wf-live-traffic-legend {
2247 + background-color: var(--mainwp-element-background) !important;
2248 +}
2249 +
2250 +.mainwp-ui.mainwp-custom-theme #wf-live-traffic select,
2251 +.mainwp-ui.mainwp-custom-theme .select2-container--default .select2-selection--single {
2252 + background-color: var(--mainwp-element-background) !important;
2253 + border: 1px solid var(--mainwp-border) !important;
2254 + color: var(--mainwp-text) !important;
2255 +}
2256 +
2257 +.mainwp-ui.mainwp-custom-theme #wf-live-traffic table tbody tr td {
2258 + border-color: var(--mainwp-border) !important;
2259 + background-color: var(--mainwp-element-background) !important;
2260 +}
2261 +
2262 +.mainwp-ui.mainwp-custom-theme #wf-live-traffic .wf-btn.wf-btn-default {
2263 + background-color: var(--mainwp-element-background) !important;
2264 + border: 1px solid var(--mainwp-border) !important;
2265 + border-radius: var(--button-radius) !important;
2266 + color: var(--mainwp-text) !important;
2267 +}
2268 +
2269 +
2270 +/* light theme */
2271 +.mainwp-ui.mainwp-custom-theme .dt-scroll-body tbody tr.selected .ui.red.button,
2272 +.mainwp-ui.mainwp-custom-theme .dt-scroll-body tbody tr.selected .ui.basic.red.button,
2273 +.mainwp-ui.mainwp-custom-theme .dt-scroll-body tbody tr.selected .ui.button.green,
2274 +.mainwp-ui.mainwp-custom-theme .dt-scroll-body tbody tr.selected .ui.button.basic.green{
2275 + color: var(--mainwp-text) !important;
2276 +}
2277 +
2278 +@media screen and (max-width: 767.98px) {
2279 +
2280 + .mainwp-ui.mainwp-custom-theme.mainwp-ui-leftmenu #wpwrap::before {
2281 + display: none;
2282 + }
2283 +
2284 + .mainwp-ui.mainwp-custom-theme #mainwp-top-header {
2285 + position: relative !important;
2286 + }
2287 +
2288 + .mainwp-ui.mainwp-custom-theme #mainwp-page-navigation-wrapper {
2289 + margin: 1rem !important;
2290 + top: auto !important;
2291 + bottom: auto !important;
2292 + width: calc(100% - 2rem) !important;
2293 + }
2294 + .mainwp-ui.mainwp-custom-theme #mainwp-page-navigation-wrapper .menu {
2295 + width: 100% !important;
2296 + }
2297 +
2298 + .mainwp-ui.mainwp-custom-theme #mainwp-module-cost-tracker-settings-tab,
2299 + .mainwp-ui.mainwp-custom-theme #mainwp-site-mode-wrap {
2300 + width: 100% !important;
2301 + }
2302 +
2303 + .mainwp-ui.mainwp-custom-theme .mainwp-sub-header,
2304 + .mainwp-ui.mainwp-custom-theme .mainwp-actions-bar {
2305 + margin-top: 1rem !important;
2306 + }
2307 +
2308 +}