PluginProbe ʕ •ᴥ•ʔ
The Post Grid – Shortcode, Gutenberg Blocks and Elementor Addon for Post Grid / 7.7.0
The Post Grid – Shortcode, Gutenberg Blocks and Elementor Addon for Post Grid v7.7.0
7.9.3 7.9.2 trunk 4.0.0 4.0.1 4.0.2 4.0.3 4.0.4 4.0.5 4.1.0 4.1.1 4.1.2 4.1.3 4.1.4 4.1.5 4.2.0 4.2.1 4.2.2 4.2.3 5.0.0 5.0.1 5.0.2 5.0.3 5.0.4 5.0.5 6.0.0 7.0.0 7.0.1 7.0.2 7.1.0 7.2.0 7.2.1 7.2.10 7.2.11 7.2.2 7.2.3 7.2.4 7.2.5 7.2.6 7.2.7 7.2.8 7.2.9 7.3.0 7.3.1 7.4.0 7.4.1 7.4.2 7.4.3 7.5.0 7.6.0 7.6.1 7.7.0 7.7.1 7.7.10 7.7.11 7.7.12 7.7.13 7.7.14 7.7.15 7.7.16 7.7.17 7.7.18 7.7.19 7.7.2 7.7.20 7.7.21 7.7.22 7.7.3 7.7.4 7.7.5 7.7.6 7.7.7 7.7.8 7.7.9 7.8.0 7.8.1 7.8.2 7.8.3 7.8.4 7.8.5 7.8.6 7.8.7 7.8.8 7.8.9 7.9.0 7.9.1
the-post-grid / assets / css / admin / block-admin.css
the-post-grid / assets / css / admin Last commit date
admin-preview.css 2 years ago admin.css 2 years ago block-admin.css 2 years ago editor-el.css 2 years ago tpg-el-editor.css 2 years ago
block-admin.css
1671 lines
1 .rttpg-panel-control-wrapper,
2 .rttpg-components-popover {
3 --rttpg-admin-color-primary: #0066ff;
4 --rttpg-admin-color-primary-dark: #004dbf;
5 --rttpg-admin-color-secondary: #555555;
6 --rttpg-admin-color-black: #000000;
7 --rttpg-admin-color-body: #333333;
8 --rttpg-admin-root-tab-active: #ecf4ff;
9 --rttpg-admin-color-border: #cccccc;
10 --rttpg-admin-column-gap: 10px;
11 --rttpg-admin-row-gap: 10px;
12 --rttpg-admin-tab-btn-bg: #f9f9f9;
13 --rttpg-admin-tab-btn-bg-hover: #e0e0e0;
14 --rttpg-admin-text-xs: 13px;
15 --rttpg-admin-text-base: 13px;
16 --rttpg-admin-text-sm: 13px;
17 --rttpg-admin-text-md: 16px;
18 --rttpg-admin-transition: all 0.3s ease-in-out;
19 --wp-admin-theme-color: #0066ff;
20 --wp-admin-theme-color--rgb: 0, 102, 255;
21 --rttpg-admin-red-color: #f54;
22 color: var(--rttpg-admin-color-body);
23 }
24
25 .rttpg-panel-control-wrapper {
26 background: #e6e9ec;
27 }
28
29 body .rt-container-fluid {
30 padding-left: 0;
31 padding-right: 0;
32 }
33
34 img {
35 max-width: 100%;
36 }
37
38 input.disabled, input:disabled, textarea.disabled, textarea:disabled {
39 background: rgb(211 211 211 / 50%);
40 }
41
42 .rttpg-panel-control-wrapper .components-tab-panel__tabs {
43 background: #fff;
44 border-top: 1px solid #d1d1d1;
45 position: sticky;
46 top: 0;
47 z-index: 999;
48 box-shadow: 0 4px 5px 0 rgb(32 33 36 / 9%);
49 }
50
51 .rttpg-panel-control-wrapper .components-toggle-control {
52 width: 100%;
53 }
54
55 .rttpg-components-popover .components-base-control__field,
56 .rttpg-panel-control-wrapper .components-base-control__field {
57 margin-bottom: 0;
58 }
59
60 .rttpg-components-popover .components-base-control,
61 .rttpg-components-popover .rttpg-control-field,
62 .rttpg-panel-control-wrapper .components-base-control,
63 .rttpg-panel-control-wrapper .rttpg-control-field,
64 .rttpg-panel-control-wrapper .components-border-control {
65 --wp-admin-theme-color: #0066ff;
66 --wp-admin-theme-color--rgb: 0, 102, 255;
67 --column-gap: 10px;
68 --row-gap: 10px;
69 margin-bottom: 10px;
70 }
71
72 .components-toggle-control .components-base-control__field .components-toggle-control__label {
73 flex-basis: 190px;
74 }
75
76 .rttpg-components-popover .components-base-control:last-of-type,
77 .rttpg-components-popover .rttpg-control-field:last-of-type,
78 .rttpg-panel-control-wrapper .components-base-control:last-of-type,
79 .rttpg-panel-control-wrapper .rttpg-control-field:last-of-type {
80 margin-bottom: 6px;
81 }
82
83 .rttpg-components-popover .components-base-control.rttpg-cf-range-wrap .rttpg-cf-head,
84 .rttpg-components-popover .components-base-control.rttpg-cf-dimension .rttpg-cf-head,
85 .rttpg-components-popover .rttpg-control-field.rttpg-cf-range-wrap .rttpg-cf-head,
86 .rttpg-components-popover .rttpg-control-field.rttpg-cf-dimension .rttpg-cf-head,
87 .rttpg-panel-control-wrapper .components-base-control.rttpg-cf-range-wrap .rttpg-cf-head,
88 .rttpg-panel-control-wrapper .components-base-control.rttpg-cf-dimension .rttpg-cf-head,
89 .rttpg-panel-control-wrapper .rttpg-control-field.rttpg-cf-range-wrap .rttpg-cf-head,
90 .rttpg-panel-control-wrapper .rttpg-control-field.rttpg-cf-dimension .rttpg-cf-head {
91 justify-content: space-between;
92 }
93
94 .rttpg-components-popover .components-base-control .rttpg-cf-head,
95 .rttpg-components-popover .rttpg-control-field .rttpg-cf-head,
96 .rttpg-panel-control-wrapper .components-base-control .rttpg-cf-head,
97 .rttpg-panel-control-wrapper .rttpg-control-field .rttpg-cf-head {
98 display: flex;
99 align-items: center;
100 }
101
102 .rttpg-components-popover .components-base-control .rttpg-cf-body .components-base-control,
103 .rttpg-components-popover .rttpg-control-field .rttpg-cf-body .components-base-control,
104 .rttpg-panel-control-wrapper .components-base-control .rttpg-cf-body .components-base-control,
105 .rttpg-panel-control-wrapper .rttpg-control-field .rttpg-cf-body .components-base-control {
106 margin-bottom: 0 !important;
107 }
108
109 .rttpg-components-popover .components-base-control .rttpg-left-part,
110 .rttpg-components-popover .rttpg-control-field .rttpg-left-part,
111 .rttpg-panel-control-wrapper .components-base-control .rttpg-left-part,
112 .rttpg-panel-control-wrapper .rttpg-control-field .rttpg-left-part {
113 display: flex;
114 align-items: center;
115 gap: var(--column-gap, 10px);
116 }
117
118 .rttpg-components-popover .components-base-control .rttpg-units-choices,
119 .rttpg-components-popover .rttpg-control-field .rttpg-units-choices,
120 .rttpg-panel-control-wrapper .components-base-control .rttpg-units-choices,
121 .rttpg-panel-control-wrapper .rttpg-control-field .rttpg-units-choices {
122 display: flex;
123 gap: 5px;
124 justify-content: flex-end;
125 }
126
127 .rttpg-components-popover .components-base-control .rttpg-units-choices label,
128 .rttpg-components-popover .rttpg-control-field .rttpg-units-choices label,
129 .rttpg-panel-control-wrapper .components-base-control .rttpg-units-choices label,
130 .rttpg-panel-control-wrapper .rttpg-control-field .rttpg-units-choices label {
131 cursor: pointer;
132 padding: 0;
133 text-transform: uppercase;
134 font-size: 10px;
135 font-weight: 500;
136 }
137
138 .rttpg-components-popover .components-base-control .rttpg-units-choices label:hover, .rttpg-components-popover .components-base-control .rttpg-units-choices label.active,
139 .rttpg-components-popover .rttpg-control-field .rttpg-units-choices label:hover,
140 .rttpg-components-popover .rttpg-control-field .rttpg-units-choices label.active,
141 .rttpg-panel-control-wrapper .components-base-control .rttpg-units-choices label:hover,
142 .rttpg-panel-control-wrapper .components-base-control .rttpg-units-choices label.active,
143 .rttpg-panel-control-wrapper .rttpg-control-field .rttpg-units-choices label:hover,
144 .rttpg-panel-control-wrapper .rttpg-control-field .rttpg-units-choices label.active {
145 color: var(--rttpg-admin-color-primary, #0066ff);
146 }
147
148 .rttpg-components-popover .components-base-control .components-base-control__help,
149 .rttpg-components-popover .rttpg-control-field .components-base-control__help,
150 .rttpg-panel-control-wrapper .components-base-control .components-base-control__help,
151 .rttpg-panel-control-wrapper .rttpg-control-field .components-base-control__help {
152 font-size: 12px;
153 font-style: italic;
154 margin-top: 0;
155 color: #888;
156 margin-bottom: 0;
157 }
158
159 .rttpg-components-popover .components-base-control .components-input-control__label,
160 .rttpg-components-popover .components-base-control .components-toggle-control__label,
161 .rttpg-components-popover .components-base-control .components-base-control__label,
162 .rttpg-components-popover .components-base-control .rttpg-label,
163 .rttpg-components-popover .rttpg-control-field .components-input-control__label,
164 .rttpg-components-popover .rttpg-control-field .components-toggle-control__label,
165 .rttpg-components-popover .rttpg-control-field .components-base-control__label,
166 .rttpg-components-popover .rttpg-control-field .rttpg-label,
167 .rttpg-panel-control-wrapper .components-base-control .components-input-control__label,
168 .rttpg-panel-control-wrapper .components-base-control .components-toggle-control__label,
169 .rttpg-panel-control-wrapper .components-base-control .components-base-control__label,
170 .rttpg-panel-control-wrapper .components-base-control .rttpg-label,
171 .rttpg-panel-control-wrapper .rttpg-control-field .components-input-control__label,
172 .rttpg-panel-control-wrapper .rttpg-control-field .components-toggle-control__label,
173 .rttpg-panel-control-wrapper .rttpg-control-field .components-base-control__label,
174 .rttpg-panel-control-wrapper .rttpg-control-field .rttpg-label {
175 font-size: var(--rttpg-admin-text-base, 13px) !important;
176 color: var(--rttpg-admin-color-secondary, #000) !important;
177 font-weight: 500 !important;
178 line-height: 1.3 !important;
179 text-transform: capitalize !important;
180 }
181
182 .rttpg-components-popover .components-base-control .components-input-control__label,
183 .rttpg-components-popover .components-base-control .components-base-control__label,
184 .rttpg-components-popover .rttpg-control-field .components-input-control__label,
185 .rttpg-components-popover .rttpg-control-field .components-base-control__label,
186 .rttpg-panel-control-wrapper .components-base-control .components-input-control__label,
187 .rttpg-panel-control-wrapper .components-base-control .components-base-control__label,
188 .rttpg-panel-control-wrapper .rttpg-control-field .components-input-control__label,
189 .rttpg-panel-control-wrapper .rttpg-control-field .components-base-control__label {
190 padding-bottom: var(--row-gap, 8px) !important;
191 margin-bottom: 0 !important;
192 display: inline-block;
193 }
194
195 .rttpg-components-popover .components-base-control .components-input-control__input,
196 .rttpg-components-popover .components-base-control .components-select-control__input,
197 .rttpg-components-popover .components-base-control .components-textarea-control__input,
198 .rttpg-components-popover .components-base-control .components-text-control__input,
199 .rttpg-components-popover .rttpg-control-field .components-input-control__input,
200 .rttpg-components-popover .rttpg-control-field .components-select-control__input,
201 .rttpg-components-popover .rttpg-control-field .components-textarea-control__input,
202 .rttpg-components-popover .rttpg-control-field .components-text-control__input,
203 .rttpg-panel-control-wrapper .components-base-control .components-input-control__input,
204 .rttpg-panel-control-wrapper .components-base-control .components-select-control__input,
205 .rttpg-panel-control-wrapper .components-base-control .components-textarea-control__input,
206 .rttpg-panel-control-wrapper .components-base-control .components-text-control__input,
207 .rttpg-panel-control-wrapper .rttpg-control-field .components-input-control__input,
208 .rttpg-panel-control-wrapper .rttpg-control-field .components-select-control__input,
209 .rttpg-panel-control-wrapper .rttpg-control-field .components-textarea-control__input,
210 .rttpg-panel-control-wrapper .rttpg-control-field .components-text-control__input {
211 line-height: 1.5 !important;
212 color: var(--rttpg-admin-color-secondary, #555555) !important;
213 border-radius: 3px;
214 border: 1px solid var(--rttpg-admin-color-border, #e9e9e9) !important;
215 transition: var(--rttpg-admin-transition, all 0.3s ease);
216 padding-top: 3px;
217 padding-bottom: 3px;
218 height: 32px !important;
219 }
220
221 .rttpg-components-popover .components-base-control .components-input-control__input:focus,
222 .rttpg-components-popover .components-base-control .components-select-control__input:focus,
223 .rttpg-components-popover .components-base-control .components-textarea-control__input:focus,
224 .rttpg-components-popover .components-base-control .components-text-control__input:focus,
225 .rttpg-components-popover .rttpg-control-field .components-input-control__input:focus,
226 .rttpg-components-popover .rttpg-control-field .components-select-control__input:focus,
227 .rttpg-components-popover .rttpg-control-field .components-textarea-control__input:focus,
228 .rttpg-components-popover .rttpg-control-field .components-text-control__input:focus,
229 .rttpg-panel-control-wrapper .components-base-control .components-input-control__input:focus,
230 .rttpg-panel-control-wrapper .components-base-control .components-select-control__input:focus,
231 .rttpg-panel-control-wrapper .components-base-control .components-textarea-control__input:focus,
232 .rttpg-panel-control-wrapper .components-base-control .components-text-control__input:focus,
233 .rttpg-panel-control-wrapper .rttpg-control-field .components-input-control__input:focus,
234 .rttpg-panel-control-wrapper .rttpg-control-field .components-select-control__input:focus,
235 .rttpg-panel-control-wrapper .rttpg-control-field .components-textarea-control__input:focus,
236 .rttpg-panel-control-wrapper .rttpg-control-field .components-text-control__input:focus {
237 outline: 0;
238 box-shadow: none;
239 border-color: var(--rttpg-admin-color-primary, #0066ff) !important;
240 }
241
242
243 .rttpg-components-popover .components-base-control .components-textarea-control__input,
244 .rttpg-components-popover .rttpg-control-field .components-textarea-control__input,
245 .rttpg-panel-control-wrapper .components-base-control .components-textarea-control__input,
246 .rttpg-panel-control-wrapper .rttpg-control-field .components-textarea-control__input {
247 height: 80px;
248 }
249
250 .rttpg-components-popover .components-base-control .components-input-control__backdrop,
251 .rttpg-components-popover .rttpg-control-field .components-input-control__backdrop,
252 .rttpg-panel-control-wrapper .components-base-control .components-input-control__backdrop,
253 .rttpg-panel-control-wrapper .rttpg-control-field .components-input-control__backdrop {
254 display: none;
255 }
256
257 .rttpg-components-popover .components-base-control .components-form-toggle .components-form-toggle__track,
258 .rttpg-components-popover .rttpg-control-field .components-form-toggle .components-form-toggle__track,
259 .rttpg-panel-control-wrapper .components-base-control .components-form-toggle .components-form-toggle__track,
260 .rttpg-panel-control-wrapper .rttpg-control-field .components-form-toggle .components-form-toggle__track {
261 border-color: #000;
262 }
263
264 .rttpg-components-popover .components-base-control .components-form-toggle .components-form-toggle__input:focus,
265 .rttpg-components-popover .rttpg-control-field .components-form-toggle .components-form-toggle__input:focus,
266 .rttpg-panel-control-wrapper .components-base-control .components-form-toggle .components-form-toggle__input:focus,
267 .rttpg-panel-control-wrapper .rttpg-control-field .components-form-toggle .components-form-toggle__input:focus {
268 box-shadow: none;
269 outline: 0;
270 }
271
272 .rttpg-components-popover .components-base-control .components-form-toggle .components-form-toggle__input:focus + .components-form-toggle__track,
273 .rttpg-components-popover .rttpg-control-field .components-form-toggle .components-form-toggle__input:focus + .components-form-toggle__track,
274 .rttpg-panel-control-wrapper .components-base-control .components-form-toggle .components-form-toggle__input:focus + .components-form-toggle__track,
275 .rttpg-panel-control-wrapper .rttpg-control-field .components-form-toggle .components-form-toggle__input:focus + .components-form-toggle__track {
276 box-shadow: none;
277 outline: 0;
278 }
279
280 .rttpg-components-popover .components-base-control .components-form-toggle.is-checked .components-form-toggle__track,
281 .rttpg-components-popover .rttpg-control-field .components-form-toggle.is-checked .components-form-toggle__track,
282 .rttpg-panel-control-wrapper .components-base-control .components-form-toggle.is-checked .components-form-toggle__track,
283 .rttpg-panel-control-wrapper .rttpg-control-field .components-form-toggle.is-checked .components-form-toggle__track {
284 border-color: var(--rttpg-admin-color-primary, #0066ff);
285 background-color: var(--rttpg-admin-color-primary, #0066ff);
286 }
287
288 .rttpg-components-popover .components-base-control .components-form-toggle.is-checked .components-form-toggle__thumb,
289 .rttpg-components-popover .rttpg-control-field .components-form-toggle.is-checked .components-form-toggle__thumb,
290 .rttpg-panel-control-wrapper .components-base-control .components-form-toggle.is-checked .components-form-toggle__thumb,
291 .rttpg-panel-control-wrapper .rttpg-control-field .components-form-toggle.is-checked .components-form-toggle__thumb {
292 background-color: #fff;
293 border-color: #fff;
294 }
295
296 .rttpg-components-popover .rttpg-control-single-field,
297 .rttpg-panel-control-wrapper .rttpg-control-single-field {
298 margin-top: 10px;
299 }
300
301 .rttpg-components-popover .rttpg-undo-btn.components-button,
302 .rttpg-components-popover .rttpg-undo-btn.has-icon,
303 .rttpg-panel-control-wrapper .rttpg-undo-btn.components-button,
304 .rttpg-panel-control-wrapper .rttpg-undo-btn.has-icon {
305 font-size: 16px;
306 padding: 0;
307 background-color: transparent;
308 }
309
310 .rttpg-components-popover .rttpg-undo-btn.components-button:hover, .rttpg-components-popover .rttpg-undo-btn.has-icon:hover,
311 .rttpg-panel-control-wrapper .rttpg-undo-btn.components-button:hover,
312 .rttpg-panel-control-wrapper .rttpg-undo-btn.has-icon:hover {
313 background-color: transparent;
314 }
315
316 .rttpg-components-popover .rttpg-undo-btn.components-button:focus, .rttpg-components-popover .rttpg-undo-btn.components-button:hover, .rttpg-components-popover .rttpg-undo-btn.components-button:active, .rttpg-components-popover .rttpg-undo-btn.has-icon:focus, .rttpg-components-popover .rttpg-undo-btn.has-icon:hover, .rttpg-components-popover .rttpg-undo-btn.has-icon:active,
317 .rttpg-panel-control-wrapper .rttpg-undo-btn.components-button:focus,
318 .rttpg-panel-control-wrapper .rttpg-undo-btn.components-button:hover,
319 .rttpg-panel-control-wrapper .rttpg-undo-btn.components-button:active,
320 .rttpg-panel-control-wrapper .rttpg-undo-btn.has-icon:focus,
321 .rttpg-panel-control-wrapper .rttpg-undo-btn.has-icon:hover,
322 .rttpg-panel-control-wrapper .rttpg-undo-btn.has-icon:active {
323 outline: 0;
324 box-shadow: none;
325 }
326
327 .rttpg-components-popover .rttpg-undo-btn.components-button span, .rttpg-components-popover .rttpg-undo-btn.has-icon span,
328 .rttpg-panel-control-wrapper .rttpg-undo-btn.components-button span,
329 .rttpg-panel-control-wrapper .rttpg-undo-btn.has-icon span {
330 font-size: inherit;
331 height: auto;
332 }
333
334 /*.rttpg-components-popover*/
335 .rttpg-components-popover .components-base-control .components-input-control__label,
336 .rttpg-components-popover .components-base-control .components-base-control__label,
337 .rttpg-components-popover .rttpg-control-field .components-input-control__label,
338 .rttpg-components-popover .rttpg-control-field .components-base-control__label {
339 margin-bottom: 6px !important;
340 }
341
342 .rttpg-components-popover .components-base-control .components-input-control__input,
343 .rttpg-components-popover .components-base-control .components-select-control__input,
344 .rttpg-components-popover .components-base-control .components-text-control__input,
345 .rttpg-components-popover .rttpg-control-field .components-input-control__input,
346 .rttpg-components-popover .rttpg-control-field .components-select-control__input,
347 .rttpg-components-popover .rttpg-control-field .components-text-control__input {
348 height: 34px !important;
349 }
350
351 /*rttpg-components-popover*/
352 .rttpg-components-popover {
353 --row-gap: 8px;
354 }
355
356 .rttpg-components-popover .components-input-control__backdrop {
357 display: none;
358 }
359
360 .rttpg-components-popover .components-popover__content::-webkit-scrollbar {
361 width: 8px;
362 border-radius: 8px;
363 }
364
365 .rttpg-components-popover .components-popover__content::-webkit-scrollbar-track {
366 background: linear-gradient(to bottom, #0066ff 0%, #488cf1 100%, #9dff00 0%, #f5440f 100%);
367 border-radius: 8px;
368 }
369
370 .rttpg-components-popover .components-popover__content::-webkit-scrollbar-thumb {
371 background: transparent;
372 box-shadow: 0px 0px 0px 1000vh black;
373 border-radius: 8px;
374 }
375
376 /*rttpg-tab-panel -- tab buttons*/
377 .rttpg-tab-panel .components-button {
378 color: #505960;
379 transition: var(--rttpg-admin-transition, all 0.3s ease);
380 }
381
382 .rttpg-tab-panel .components-button:focus {
383 outline: 0;
384 box-shadow: none;
385 }
386
387 .rttpg-tab-panel .rttpg-tab-btn {
388 position: relative;
389 height: 58px;
390 padding: 5px 0;
391 flex-grow: 1;
392 display: block;
393 border-right: 1px solid #efefef;
394 font-size: 12px;
395 border-bottom: 3px solid transparent;
396 }
397
398 .rttpg-tab-panel .rttpg-tab-btn:not(:last-child)::after {
399 content: "";
400 position: absolute;
401 right: 0;
402 top: 0;
403 bottom: 0;
404 width: 1px;
405 height: 100%;
406 background: #efefef;
407 }
408
409 .rttpg-tab-panel .rttpg-tab-btn:last-child {
410 border-right: none;
411 }
412
413 .rttpg-tab-panel .rttpg-tab-btn:hover {
414 color: var(--rttpg-admin-color-primary, #0066ff);
415 }
416
417 .rttpg-tab-panel .rttpg-tab-btn.active-tab {
418 border-bottom-color: var(--rttpg-admin-color-primary, #0066ff);
419 color: var(--rttpg-admin-color-primary, #0066ff);
420 }
421
422 .rttpg-tab-panel .rttpg-tab-btn.active-tab::before {
423 visibility: visible;
424 opacity: 1;
425 }
426
427 .rttpg-tab-panel .rttpg-tab-btn.content::before,
428 .rttpg-tab-panel .rttpg-tab-btn.settings::before,
429 .rttpg-tab-panel .rttpg-tab-btn.styles::before {
430 position: static;
431 font-family: dashicons;
432 display: block;
433 line-height: 1;
434 font-weight: 400;
435 font-size: 20px;
436 margin-bottom: 3px;
437 }
438
439 .rttpg-tab-panel .rttpg-tab-btn.content::before {
440 content: '\f464';
441 }
442
443 .rttpg-tab-panel .rttpg-tab-btn.settings::before {
444 content: '\f111';
445 }
446
447 .rttpg-tab-panel .rttpg-tab-btn.styles::before {
448 content: '\f475';
449 }
450
451 .rttpg-tab-content .components-button {
452 font-size: var(--rttpg-admin-text-base, 13px);
453 background: #ffffff;
454 color: var(--rttpg-admin-color-secondary, #555);
455 font-weight: bold;
456 border-radius: 0;
457 border-bottom: 1px solid #e3e3e3;
458 padding-top: 12px;
459 padding-bottom: 12px;
460 }
461
462 .rttpg-tab-content .components-button .components-panel__arrow {
463 color: inherit;
464 }
465
466 .rttpg-tab-content .components-button:hover {
467 color: var(--rttpg-admin-color-primary, #0066ff);
468 }
469
470 .rttpg-tab-content .components-button.rttpg-undo-btn {
471 border: none;
472 }
473
474 .rttpg-tab-content .components-panel__body-title > .components-button {
475 color: #495157;
476 font-weight: 700;
477 transition: 0.4s;
478 }
479
480 .rttpg-tab-content .is-opened .components-panel__body-title > .components-button {
481 color: var(--rttpg-admin-color-primary, #0066ff);
482 }
483
484 .rttpg-go-to-premium-panel .components-panel__body-title > .components-button {
485 color: var(--rttpg-admin-red-color);
486 text-align: center;
487 display: block;
488 padding-left: 0;
489 padding-right: 0;
490 pointer-events: none;
491 }
492
493 .rttpg-go-to-premium-panel .components-panel__body-title > .components-button span {
494 display: none;
495 }
496
497 .rttpg-tab-content .rttpg-btn-group {
498 display: flex;
499 align-items: center;
500 justify-content: space-between;
501 }
502
503 .rttpg-tab-content .rttpg-btn-group .components-button {
504 box-shadow: none;
505 outline: 0;
506 }
507
508 .rttpg-tab-content .rttpg-btn-group .components-button:active, .rttpg-tab-content .rttpg-btn-group .components-button:focus, .rttpg-tab-content .rttpg-btn-group .components-button:hover {
509 box-shadow: none;
510 outline: 0;
511 }
512
513 .rttpg-tab-content .rttpg-btn-group .components-button.is-secondary:active, .rttpg-tab-content .rttpg-btn-group .components-button.is-secondary:focus, .rttpg-tab-content .rttpg-btn-group .components-button.is-secondary:hover {
514 box-shadow: none;
515 outline: 0;
516 }
517
518 .rttpg-tab-content .rttpg-btn-group .components-button.is-secondary:hover {
519 color: var(--rttpg-admin-color-primary, #0066ff);
520 }
521
522 .rttpg-tab-content .rttpg-btn-group .rttpg-button,
523 .rttpg-tab-content .rttpg-btn-group .components-button {
524 display: inline-flex;
525 align-items: center;
526 justify-content: center;
527 flex-grow: 1;
528 font-size: var(--rttpg-admin-text-xs, 12px);
529 color: var(--rttpg-admin-color-secondary, #555);
530 background-color: var(--rttpg-admin-color-white, #fff);
531 border: 1px solid var(--rttpg-admin-color-border, #e9e9e9);
532 padding: 2px;
533 height: 32px;
534 cursor: pointer;
535 transition: var(--rttpg-admin-transition, all 0.3s ease-in-out);
536 }
537
538 .rttpg-tab-content .rttpg-btn-group .rttpg-button:first-of-type,
539 .rttpg-tab-content .rttpg-btn-group .components-button:first-of-type {
540 border-radius: 3px 0 0 3px;
541 }
542
543 .rttpg-tab-content .rttpg-btn-group.rttpg-bottom-border-radius-none .components-button:first-of-type {
544 border-radius: 3px 0 0 0;
545 }
546
547 .rttpg-tab-content .rttpg-btn-group.rttpg-bottom-border-radius-none .components-button:last-of-type {
548 border-radius: 0 3px 0 0;
549 }
550
551 .rttpg-tab-content .rttpg-btn-group .rttpg-button:last-of-type,
552 .rttpg-tab-content .rttpg-btn-group .components-button:last-of-type {
553 border-radius: 0 3px 3px 0;
554 }
555
556 .rttpg-tab-content .rttpg-btn-group .rttpg-button:not(:last-of-type),
557 .rttpg-tab-content .rttpg-btn-group .components-button:not(:last-of-type) {
558 border-right: none;
559 }
560
561 .rttpg-tab-content .rttpg-btn-group .rttpg-button .components-button + .components-button,
562 .rttpg-tab-content .rttpg-btn-group .rttpg-button .rttpg-button + .rttpg-button,
563 .rttpg-tab-content .rttpg-btn-group .components-button .components-button + .components-button,
564 .rttpg-tab-content .rttpg-btn-group .components-button .rttpg-button + .rttpg-button {
565 margin: 0;
566 }
567
568 .rttpg-tab-content .rttpg-btn-group .rttpg-button.is-primary, .rttpg-tab-content .rttpg-btn-group .rttpg-button.active,
569 .rttpg-tab-content .rttpg-btn-group .components-button.is-primary,
570 .rttpg-tab-content .rttpg-btn-group .components-button.active {
571 border-color: var(--rttpg-admin-color-primary, #0066ff);
572 color: var(--rttpg-admin-color-white, #fff);
573 background-color: var(--rttpg-admin-color-primary, #0066ff);
574 }
575
576 .rttpg-tab-content .rttpg-btn-group.rttpg-btn-group-state {
577 margin-bottom: 16px;
578 }
579
580 .rttpg-tab-content .rttpg-btn-group.rttpg-btn-group-state + .rttpg-ground-control {
581 margin-top: -19px;
582 }
583
584 .rttpg-tab-content .rttpg-btn-group.rttpg-btn-group-state .components-button {
585 height: 34px;
586 font-weight: 500;
587 font-size: var(--rttpg-admin-text-base, 13px);
588 }
589
590 .rttpg-tab-content .components-panel__body.is-opened > .components-panel__body-title {
591 margin-bottom: 10px;
592 }
593
594 .rttpg-img-remove-btn {
595 height: 100px;
596 width: 100%;
597 margin-bottom: 5px;
598 }
599
600 .rttpg-img-remove-btn span {
601 font-size: 30px;
602 width: auto;
603 height: auto;
604 margin: 0;
605 }
606
607
608 .block-editor-block-inspector .components-base-control:last-of-type {
609 margin-bottom: 6px;
610 }
611
612 .block-editor-block-inspector .components-base-control .components-textarea-control__input,
613 .block-editor-block-inspector .components-base-control .components-text-control__input,
614 .block-editor-block-inspector .components-base-control .components-input-control__input {
615 line-height: 1.5 !important;
616 height: 36px;
617 padding: 8px;
618 color: var(--rttpg-admin-color-secondary, #555);
619 border-radius: 3px;
620 border: 1px solid var(--rttpg-admin-color-border, #e9e9e9);
621 transition: var(--rttpg-admin-transition, all 0.3s ease-in-out);
622 }
623
624 .block-editor-block-inspector .components-base-control .components-textarea-control__input:focus,
625 .block-editor-block-inspector .components-base-control .components-text-control__input:focus {
626 outline: 0;
627 box-shadow: none;
628 border-color: var(--rttpg-admin-color-primary, #0066ff);
629 }
630
631 .block-editor-block-inspector .components-base-control .components-textarea-control__input {
632 height: 80px;
633 }
634
635 .block-editor-block-inspector .components-base-control .components-base-control__label,
636 .block-editor-block-inspector .components-base-control .components-toggle-control__label {
637 font-size: var(--rttpg-admin-text-base, 13px);
638 color: var(--rttpg-admin-color-secondary, #555);
639 font-weight: 500;
640 }
641
642 .block-editor-block-inspector .components-base-control .components-base-control__label {
643 margin-bottom: var(--row-gap, 10px);
644 display: inline-block;
645 }
646
647 .block-editor-block-inspector__advanced .components-button {
648 font-size: var(--rttpg-admin-text-base, 13px);
649 color: var(--rttpg-admin-color-black, #000);
650 font-weight: 500;
651 }
652
653 .block-editor-block-inspector__advanced .components-button .components-panel__arrow {
654 color: inherit;
655 }
656
657 .block-editor-block-inspector__advanced .components-button:focus {
658 outline: 0;
659 box-shadow: none;
660 }
661
662 .rttpg-panel-control-wrapper .components-panel__body {
663 margin-top: 10px !important;
664 background: #fff;
665 border-top: none !important;
666 }
667
668 .rttpg-panel-control-wrapper .components-panel__body.is-opened {
669 border-top: 1px solid #e0e0e0;
670 }
671
672 .rttpg-panel-control-wrapper .components-panel__body:last-child {
673 border-bottom: 10px solid #e6e9ec;
674 }
675
676 .rttpg-sortable-list {
677 display: grid;
678 gap: 10px;
679 margin-bottom: 10px;
680 }
681
682 .rttpg-sortable-list .rttpg-sortable-expand-area {
683 border: 1px solid #d3d3d3;
684 border-top: 0;
685 padding: 10px;
686 }
687
688 .rttpg-sortable-list .rttpg-sortable-item {
689 border: 1px solid #d3d3d3;
690 display: flex;
691 align-items: center;
692 justify-content: space-between;
693 line-height: 2.5em;
694 font-size: 13px;
695 color: #555 !important;
696 height: 40px;
697 }
698
699 .rttpg-sortable-list .rttpg-sortable-item .rttpg-sortable-title {
700 flex: 12;
701 overflow: hidden;
702 padding-left: 8px;
703 text-overflow: ellipsis;
704 white-space: nowrap;
705 width: 200px;
706 padding-right: 5px;
707 display: inline-block;
708 }
709
710 .rttpg-sortable-list .rttpg-sortable-item .rttpg-sortable-title .rttpg-icon,
711 .rttpg-sortable-list .rttpg-sortable-item .rttpg-sortable-title i,
712 .rttpg-sortable-list .rttpg-sortable-item .rttpg-sortable-title svg {
713 line-height: 1;
714 display: inline-flex;
715 align-items: center;
716 margin-right: 3px;
717 position: relative;
718 top: 1px;
719 }
720
721 .rttpg-sortable-list .rttpg-sortable-item .drag-handle {
722 background: transparent !important;
723 border-left: 1px solid var(--rttpg-admin-color-border, #e9e9e9) !important;
724 border-right: none !important;
725 display: flex !important;
726 justify-content: center;
727 flex: 2 1 0 !important;
728 align-items: center;
729 color: #fff;
730 cursor: move;
731 height: 100%;
732 }
733
734 .rttpg-sortable-list .rttpg-sortable-item .rttpg-social-delete-icon {
735 font-size: 14px;
736 border-left: 1px solid #e9e9e9;
737 line-height: 2.5em;
738 flex: 2;
739 text-align: center;
740 display: flex;
741 justify-content: center;
742 height: 100%;
743 }
744
745 .rttpg-sortable-list .rttpg-sortable-item .rttpg-delete-icon:hover {
746 cursor: pointer;
747 }
748
749 .drag-helper {
750 list-style: none;
751 z-index: 100;
752 }
753
754 .rttpg-item-add-btn-wrapper .rttpg-add-accordion-button,
755 .rttpg-block > .rttpg-add-accordion-button,
756 .rttpg-block + .rttpg-add-accordion-button {
757 margin-top: 8px !important;
758 margin-bottom: 8px !important;
759 background-color: var(--rttpg-admin-tab-btn-bg, #f9f9f9) !important;
760 border: 1px solid #e2e2e2 !important;
761 padding: 12px 30px !important;
762 height: 42px !important;
763 font-size: 17px !important;
764 color: #000000 !important;
765 transition: all 0.3s ease-in-out !important;
766 }
767
768 .rttpg-item-add-btn-wrapper .rttpg-add-accordion-button:hover,
769 .rttpg-block > .rttpg-add-accordion-button:hover,
770 .rttpg-block + .rttpg-add-accordion-button:hover {
771 background-color: var(--rttpg-admin-tab-btn-bg-hover, #ededef) !important;
772 color: #212121 !important;
773 }
774
775 .rttpg-item-add-btn-wrapper .rttpg-add-accordion-button:focus,
776 .rttpg-block > .rttpg-add-accordion-button:focus,
777 .rttpg-block + .rttpg-add-accordion-button:focus {
778 outline: 0 !important;
779 box-shadow: none !important;
780 }
781
782 .rttpg-item-add-btn-wrapper .rttpg-add-accordion-button .dashicons,
783 .rttpg-block > .rttpg-add-accordion-button .dashicons,
784 .rttpg-block + .rttpg-add-accordion-button .dashicons {
785 width: 18px;
786 height: 18px;
787 font-size: 18px;
788 left: unset !important;
789 }
790
791 .rttpg-item-add-btn-wrapper.rttpg-faq {
792 text-align: center;
793 margin-top: 25px;
794 }
795
796 /*Alignment Button Style*/
797
798 .rttpg-panel-control-wrapper .rttpg-control-field.rttpg-cf-alignment-wrap {
799 display: flex;
800 justify-content: space-between;
801 }
802
803 .rttpg-panel-control-wrapper .rttpg-control-field.rttpg-cf-alignment-wrap .rttpg-btn-group .rttpg-button {
804 padding: 3px 10px;
805 }
806
807 .components-panel__body-title ~ .rttpg-add-accordion-button,
808 .rttpg-control-field ~ .rttpg-add-accordion-button {
809 margin-top: 0px !important;
810 margin-bottom: 10px !important;
811 background-color: var(--rttpg-admin-tab-btn-bg, #f9f9f9) !important;
812 border: 1px solid #e2e2e2 !important;
813 padding: 10px 12px !important;
814 height: 32px !important;
815 font-size: 13px !important;
816 transition: all 0.3s ease-in-out !important;
817 }
818
819 .components-panel__body-title ~ .rttpg-add-accordion-button:hover,
820 .rttpg-control-field ~ .rttpg-add-accordion-button:hover {
821 background-color: var(--rttpg-admin-tab-btn-bg-hover, #ededef) !important;
822 color: #212121 !important;
823 }
824
825 .components-panel__body-title ~ .rttpg-add-accordion-button:focus,
826 .rttpg-control-field ~ .rttpg-add-accordion-button:focus {
827 outline: 0 !important;
828 box-shadow: none !important;
829 }
830
831 .components-panel__body-title ~ .rttpg-add-accordion-button .dashicons,
832 .rttpg-control-field ~ .rttpg-add-accordion-button .dashicons {
833 width: 18px;
834 height: 18px;
835 font-size: 18px;
836 left: unset !important;
837 width: unset !important;
838 }
839
840 .rttpg-panel-control-wrapper [data-tooltip]:before {
841 content: attr(data-tooltip);
842 position: absolute;
843 pointer-events: none;
844 opacity: 0;
845 display: inline-flex;
846 align-items: center;
847 justify-content: center;
848 transition: all 0.15s ease;
849 padding: 6px 10px;
850 color: #fff;
851 background: #1a1a1a;
852 border-radius: 4px;
853 border-width: 0;
854 white-space: nowrap;
855 text-align: center;
856 line-height: 1.2;
857 font-size: 13px;
858 box-shadow: none;
859 right: -70px;
860 }
861
862 .rttpg-panel-control-wrapper [data-tooltip]:hover::before {
863 margin: 0;
864 opacity: 1;
865 z-index: 1000;
866 }
867
868 /*rttpg-toggle-control-field*/
869 .rttpg-toggle-control-field .components-base-control__field .components-flex,
870 .rttpg-toggle-control-field .components-base-control__field {
871 display: flex;
872 flex-direction: row-reverse;
873 justify-content: space-between;
874 align-content: center;
875 align-items: center;
876 }
877
878 .rttpg-toggle-control-field.rttpg-padding-left .components-toggle-control__label {
879 position: relative;
880 padding-left: 10px;
881 }
882
883 .rttpg-toggle-control-field.rttpg-padding-left .components-toggle-control__label::before {
884 content: "";
885 }
886
887 .rttpg-panel-control-wrapper .rttpg-control-field.label-inline .components-base-control__field,
888 .rttpg-panel-control-wrapper .rttpg-control-field.label-inline {
889 display: flex;
890 flex-direction: row;
891 justify-content: space-between;
892 align-items: center;
893 width: 100%;
894 height: auto;
895 }
896
897 .rttpg-panel-control-wrapper .rttpg-control-field.label-inline.has-help {
898 display: block;
899 }
900
901 .rttpg-panel-control-wrapper .rttpg-control-field.label-inline label {
902 padding: 0 !important;
903 line-height: 1.4;
904 }
905
906 .rttpg-panel-control-wrapper .rttpg-control-field.label-inline .components-text-control__input,
907 .rttpg-panel-control-wrapper .rttpg-control-field.label-inline .components-input-control__container {
908 max-width: 120px;
909 margin-left: 10px;
910 }
911
912 .rttpg-panel-control-wrapper .rttpg-control-field.label-inline.rttpg-expand .components-text-control__input,
913 .rttpg-panel-control-wrapper .rttpg-control-field.label-inline.rttpg-expand .components-input-control__container {
914 max-width: 160px;
915 margin-left: 10px;
916 }
917
918 .rttpg-panel-control-wrapper .rttpg-control-field.label-inline .components-base-control__field > div {
919 width: 100%;
920 display: flex;
921 justify-content: space-between;
922 flex-direction: row;
923 align-items: center;
924 }
925
926 .rttpg-panel-control-wrapper input[type=text]:focus {
927 box-shadow: none;
928 }
929
930 .rttpg-control-heading {
931 background: #eaf5ff;
932 color: #212121;
933 padding: 7px;
934 width: 100%;
935 border-left: 3px solid #0073aa;
936 }
937
938 .rttpg-panel-control-wrapper .rttpg-elm-wrapper {
939 display: flex;
940 justify-content: space-between;
941 align-items: center;
942 margin-bottom: 10px;
943 }
944
945 .rttpg-panel-control-wrapper .rttpg-elm-wrapper label {
946 flex: 0 0 70px;
947 font-weight: 500;
948 }
949
950 .rttpg-panel-control-wrapper .flatpickr-input {
951 background-color: #fff;
952 border-color: #ccc;
953 padding: 1px 15px;
954 flex: 0 0 calc(100% - 108px);
955 max-width: calc(100% - 108px);
956 }
957
958 .rttpg-panel-control-wrapper .flatpickr-input.active,
959 .rttpg-panel-control-wrapper .flatpickr-input:focus {
960 border-color: var(--rttpg-admin-color-primary, #0066ff);
961 }
962
963 .rttpg-panel-control-wrapper .flatpickr-calendar:before,
964 .rttpg-panel-control-wrapper .flatpickr-calendar:after {
965 border: none !important;
966 }
967
968 .rttpg-panel-control-wrapper hr {
969 margin: 15px 0;
970 }
971
972 @media (min-width: 768px) {
973 .interface-complementary-area {
974 width: 300px !important;
975 }
976 }
977
978 .rttpg-panel-control-wrapper .components-circular-option-picker {
979 position: relative;
980 }
981
982 .rttpg-panel-control-wrapper .components-custom-gradient-picker .components-custom-gradient-picker__ui-line {
983 margin-bottom: 16px;
984 width: calc(100% - 32px);
985 }
986
987 .rttpg-panel-control-wrapper .components-circular-option-picker .components-circular-option-picker__custom-clear-wrapper .components-button {
988 text-indent: -99999px;
989 background-color: transparent !important;
990 padding: 0 !important;
991 font-family: dashicons;
992 width: 20px;
993 color: var(--rttpg-admin-color-secondary, #555) !important;
994 position: absolute;
995 bottom: 10px;
996 }
997
998 .rttpg-panel-control-wrapper .components-circular-option-picker .components-circular-option-picker__custom-clear-wrapper .components-button:hover,
999 .rttpg-panel-control-wrapper .components-circular-option-picker .components-circular-option-picker__custom-clear-wrapper .components-button:focus {
1000 background: transparent;
1001 }
1002
1003 .rttpg-panel-control-wrapper .components-circular-option-picker .components-circular-option-picker__custom-clear-wrapper .components-button::after {
1004 content: "\f531";
1005 font-size: 16px;
1006 text-indent: 0;
1007 position: absolute;
1008 left: 0;
1009 top: 0;
1010 font-weight: normal;
1011 }
1012
1013 .components-flex.components-custom-gradient-picker__ui-line {
1014 align-items: end;
1015 }
1016
1017 .rttpg-panel-control-wrapper .rttpg-control-field.rttpg-cf-gradient-wrap .components-custom-gradient-picker__ui-line .components-flex-item:last-of-type {
1018 margin-bottom: 0 !important;
1019 }
1020
1021 /*New component css*/
1022
1023 .rttpg-panel-control-wrapper .rttpg-media-actions {
1024 position: absolute;
1025 top: 10px !important;
1026 right: 10px !important;
1027 margin-top: 0 !important;
1028 }
1029
1030 .rttpg-panel-control-wrapper .rttpg-media-actions button, .rttpg-panel-control-wrapper span.rttpg-remove-icon {
1031 position: absolute;
1032 top: 10px;
1033 right: 10px;
1034 width: 22px;
1035 height: 22px;
1036 min-height: 22px;
1037 font-size: 10px;
1038 color: #575c60;
1039 background-color: rgba(255, 255, 255, .9);
1040 border-radius: 3px;
1041 line-height: 1.6;
1042 border: 1px solid;
1043 cursor: pointer;
1044 z-index: 9;
1045 text-align: center;
1046 transition: 0.4s;
1047 }
1048
1049 .rttpg-panel-control-wrapper .rttpg-media-actions button:hover, .rttpg-panel-control-wrapper span.rttpg-remove-icon:hover {
1050 color: #373c41 !important;
1051 box-shadow: 0 0 5px 0 #000 !important;
1052 }
1053
1054 .rttpg-panel-control-wrapper .rttpg-media-actions button {
1055 position: static;
1056 text-align: center;
1057 padding: 0 0 2px 0;
1058 margin-left: 5px;
1059 }
1060
1061 .rttpg-panel-control-wrapper .rttpg-media-actions button span {
1062 font-size: inherit;
1063 }
1064
1065 .rttpg-panel-control-wrapper .rttpg-image-avatar, .rttpg-panel-control-wrapper .rttpg-placeholder-image {
1066 position: relative;
1067 border: 1px dashed #a7a7a7;
1068 padding: 20px 20px 25px;
1069 text-align: center;
1070 cursor: pointer;
1071 border-radius: 0;
1072 background-color: #d5dadf;
1073 transition: 0.4s;
1074 height: 120px;
1075 background-size: cover;
1076 background-repeat: no-repeat;
1077 background-position: center;
1078 }
1079
1080 .rttpg-panel-control-wrapper .rttpg-image-avatar:hover, .rttpg-panel-control-wrapper .rttpg-placeholder-image:hover {
1081 background-color: #bfc3c7;
1082 border-color: #838383;
1083 }
1084
1085 .rttpg-panel-control-wrapper .rttpg-image-avatar div, .rttpg-panel-control-wrapper .rttpg-placeholder-image div {
1086 margin: 8px 0;
1087 text-align: center;
1088 }
1089
1090 .rttpg-image-avatar .components-button {
1091 position: absolute;
1092 right: 6px;
1093 top: 6px;
1094 border: none;
1095 padding: 8px 10px;
1096 min-height: 30px;
1097 width: auto;
1098 line-height: 1;
1099 height: auto;
1100 font-size: 17px;
1101 color: var(--rttpg-admin-color-primary, #06f);
1102 }
1103
1104 .rttpg-image-avatar .components-button:hover {
1105 color: var(--rttpg-admin-color-white, #fff);
1106 background-color: var(--rttpg-admin-color-primary, #06f);
1107 }
1108
1109 .rttpg-components-popover .rttpg-color-ball,
1110 .rttpg-panel-control-wrapper .rttpg-color-ball {
1111 border: 4px solid #fff;
1112 box-shadow: 0 0 0 1px #d5dadf;
1113 cursor: pointer;
1114 border-radius: 0 !important;
1115 position: relative;
1116 }
1117
1118 .rttpg-components-popover .rttpg-color-ball div,
1119 .rttpg-panel-control-wrapper .rttpg-color-ball div {
1120 border-radius: 0 !important;
1121 height: 18px !important;
1122 }
1123
1124 .rttpg-panel-control-wrapper .rttpg-cf-body-content-wrap {
1125 border: 1px solid #dbdbdb;
1126 padding: 7px 10px 2px;
1127 }
1128
1129 .rttpg-panel-control-wrapper .rttpg-cf-body-btn-wrap {
1130 display: flex;
1131 align-items: center;
1132 gap: 6px;
1133 padding: 5px;
1134 background: #e3eaf5;
1135 border: 1px solid #dbdbdb;
1136 margin-bottom: -1px;
1137 min-height: 36px;
1138 }
1139
1140 .rttpg-panel-control-wrapper .rttpg-cf-body-btn-wrap .rttpg-btn-group {
1141 flex-grow: 1;
1142 max-width: 60px;
1143 margin-left: auto;
1144 }
1145
1146 .rttpg-panel-control-wrapper .rttpg-cf-body-btn-wrap .components-button {
1147 padding: 0;
1148 height: 27px;
1149 width: 30px;
1150 border: 1px solid var(--rttpg-admin-color-primary, #06f);
1151 }
1152
1153 .rttpg-panel-control-wrapper .rttpg-cf-body-btn-wrap .components-button .classic-btn {
1154 font-size: 10px;
1155 }
1156
1157 .rttpg-panel-control-wrapper .rttpg-cf-body-btn-wrap .components-button .gradient-btn {
1158 font-size: 12px;
1159 }
1160
1161 .rttpg-panel-control-wrapper .rttpg-cf-body-btn-wrap .rttpg-undo-btn {
1162 padding: 0;
1163 background-color: transparent;
1164 }
1165
1166 .rttpg-panel-control-wrapper .rttpg-cf-body-btn-wrap .rttpg-undo-btn:hover {
1167 background-color: transparent;
1168 }
1169
1170 .rttpg-panel-control-wrapper .rttpg-cf-body-btn-wrap .rttpg-undo-btn:focus, .rttpg-panel-control-wrapper .rttpg-cf-body-btn-wrap .rttpg-undo-btn:hover, .rttpg-panel-control-wrapper .rttpg-cf-body-btn-wrap .rttpg-undo-btn:active {
1171 outline: 0;
1172 box-shadow: none;
1173 }
1174
1175 .rttpg-panel-control-wrapper .components-range-control__wrapper .components-range-control__track + span {
1176 margin-left: -5px;
1177 }
1178
1179 .rttpg-panel-control-wrapper .rttpg-image-dimension {
1180 display: grid;
1181 grid-template-columns: 96px 1fr 1fr;
1182 grid-gap: 15px;
1183 }
1184
1185 .rttpg-panel-control-wrapper .components-base-control.rttpg-repeater div[class*='ValueContainer'] {
1186 padding: 2px;
1187 }
1188
1189 .rttpg-panel-control-wrapper .components-base-control.rttpg-repeater div[class*='ValueContainer'] div[class*='-placeholder'] {
1190 padding-left: 5px;
1191 }
1192
1193 .rttpg-panel-control-wrapper .components-base-control.rttpg-repeater div[class*='ValueContainer'] div[class*='-Input'] {
1194 margin: 0;
1195 padding-bottom: 0;
1196 padding-top: 0;
1197 padding-left: 5px;
1198 }
1199
1200 .rttpg-panel-control-wrapper .components-base-control.rttpg-repeater div[class*='ValueContainer'] div[role="button"] {
1201 cursor: pointer;
1202 }
1203
1204 .rttpg-panel-control-wrapper .components-base-control.rttpg-repeater div[class*='IndicatorsContainer'] {
1205 display: none;
1206 }
1207
1208 .rttpg-panel-control-wrapper .components-heading.rttpg-control-heading {
1209 margin-bottom: 10px;
1210 }
1211
1212 .rttpg-panel-control-wrapper .rttpg-ground-control {
1213 border: 1px solid rgb(222 228 233);
1214 padding: 7px;
1215 margin-bottom: 15px;
1216 border-radius: 3px;
1217 }
1218
1219 .rttpg-panel-control-wrapper .rttpg-help {
1220 display: block;
1221 color: #7c7c7c;
1222 margin-top: -5px;
1223 margin-bottom: 15px;
1224 font-size: 12px;
1225 line-height: 1.3;
1226 }
1227
1228 .rttpg-panel-control-wrapper .pl-30 {
1229 padding-left: 30px;
1230 }
1231
1232 .rttpg-block-postgrid .rttpg-postgrid-is-loading {
1233 display: flex;
1234 justify-content: center;
1235 align-items: center;
1236 min-height: 120px;
1237 width: 100%;
1238 margin-left: 15px;
1239 margin-right: 15px;
1240 background: #f1f1f5;
1241 }
1242
1243 /*Editor Overlay*/
1244 .rttpg-block-postgrid .tpg-editor-loading {
1245 position: relative;
1246 }
1247
1248 .rt-pagination .pagination-list a span {
1249 font-size: 12px;
1250 }
1251
1252 /*Scroll top*/
1253 .interface-interface-skeleton__sidebar.tpg-sidebar {
1254 background: #e6e9ec;
1255 }
1256
1257 .interface-interface-skeleton__sidebar .edit-post-sidebar__panel-tabs {
1258 transition: top 0.2s ease-in-out;
1259 }
1260
1261 .interface-interface-skeleton__sidebar.tpg-should-collapse .edit-post-sidebar__panel-tabs {
1262 top: -50px;
1263 }
1264
1265 .rttpg-panel-control-wrapper .components-panel__body.is-opened.tpg-collapse-active {
1266 height: 42px;
1267 overflow: hidden;
1268 }
1269
1270 .rttpg-panel-control-wrapper .rttpg-tab-panel ::placeholder {
1271 color: #bbb !important;
1272 }
1273
1274 .rttpg-panel-control-wrapper .rttpg-tab-panel :-moz-placeholder {
1275 color: #565656 !important;
1276 }
1277
1278 .rttpg-panel-control-wrapper .rttpg-tab-panel ::-moz-placeholder {
1279 color: #565656 !important;
1280 }
1281
1282 .tpg-settings-enable .block-editor-block-inspector__advanced {
1283 display: none;
1284 }
1285
1286 .rttpg-panel-control-wrapper .rttpg-column-group .rttpg-cf-head {
1287 margin-bottom: 5px;
1288 display: block;
1289 }
1290
1291 .rttpg-panel-control-wrapper .rttpg-column-group .rttpg-column-group-inner {
1292 display: grid;
1293 grid-template-columns: 1fr 1fr 1fr;
1294 grid-gap: 10px;
1295 text-align: center;
1296 justify-content: center;
1297 }
1298
1299 .rttpg-panel-control-wrapper .rttpg-column-group .rttpg-column-group-inner .rttpg-control-field {
1300 align-items: center;
1301 flex-direction: column-reverse;
1302 margin: 0;
1303 }
1304
1305 .rttpg-panel-control-wrapper .rttpg-column-group .rttpg-column-group-inner .rttpg-control-field > div {
1306 line-height: 1;
1307 margin-bottom: 5px;
1308 }
1309
1310 .rttpg-panel-control-wrapper .rttpg-column-group .rttpg-column-group-inner .rttpg-control-field .components-input-control__label {
1311 padding-bottom: 0 !important;
1312 color: #979797;
1313 font-weight: 600;
1314 font-size: 11px;
1315 text-transform: uppercase;
1316 }
1317
1318 .rttpg-block-postgrid .tpg-el-main-wrapper .rt-swiper-holder {
1319 margin-left: 0;
1320 margin-right: 0;
1321 }
1322
1323 .rttpg-block-postgrid .slider-layout-main .tpg-widget-heading-wrapper {
1324 margin-left: 6px;
1325 margin-right: 7px;
1326 }
1327
1328 .rttpg-block-postgrid .tpg-el-main-wrapper.slider-layout11-main .tpg-widget-heading-wrapper,
1329 .rttpg-block-postgrid .tpg-el-main-wrapper.slider-layout12-main .tpg-widget-heading-wrapper {
1330 padding-left: 0;
1331 padding-right: 0;
1332 }
1333
1334 .rt-layout-filter-container .rt-filter-wrap .rt-filter-item-wrap * {
1335 pointer-events: none;
1336 }
1337
1338 .rttpg-panel-control-wrapper .rttpg-is-pro {
1339 position: relative;
1340 cursor: not-allowed;
1341 }
1342
1343 .rttpg-panel-control-wrapper .rttpg-is-pro *:not(.rttpg-alert-message) {
1344 pointer-events: none;
1345 }
1346
1347 .rttpg-panel-control-wrapper .rttpg-arert-wrapper {
1348 position: relative;
1349 }
1350
1351 .rttpg-panel-control-wrapper .rttpg-alert-message {
1352 position: absolute;
1353 top: 0;
1354 left: 0;
1355 right: 0;
1356 bottom: 0;
1357 z-index: 20;
1358 width: 100%;
1359 height: 100%;
1360 cursor: not-allowed;
1361 }
1362
1363 .rttpg-panel-control-wrapper .rttpg-is-pro label {
1364 position: relative;
1365 overflow: unset !important;
1366 }
1367
1368 .rttpg-panel-control-wrapper .rttpg-is-pro.rttpg-dimension-wrap .rttpg-label {
1369 position: relative;
1370 }
1371
1372 .rttpg-panel-control-wrapper .rttpg-is-pro.rttpg-dimension-wrap .rttpg-label::after,
1373 .rttpg-panel-control-wrapper .rttpg-is-pro label::after {
1374 content: "Pro";
1375 border: 1px solid #ff0000;
1376 color: #fff;
1377 background-color: #ff0000;
1378 padding: 0 0;
1379 display: inline-block;
1380 position: absolute;
1381 line-height: 13px;
1382 font-size: 9px;
1383 text-transform: uppercase;
1384 border-radius: 3px;
1385 width: 25px;
1386 text-align: center;
1387 margin-left: 7px;
1388 top: -5px;
1389 }
1390
1391 .rttpg-panel-control-wrapper .rttpg-is-pro.rttpg-dimension-wrap label::after {
1392 content: none;
1393 }
1394
1395 .rttpg-panel-control-wrapper .rttpg-is-pro.rttpg-dimension-wrap .rttpg-device-switchers {
1396 display: none;
1397 }
1398
1399 .rttpg-panel-control-wrapper .rttpg-is-pro .components-form-toggle .components-form-toggle__track,
1400 .rttpg-panel-control-wrapper .rttpg-is-pro input[type=text],
1401 .rttpg-panel-control-wrapper .rttpg-is-pro input[type=number] {
1402 background: #e1e1e1;
1403 }
1404
1405 .rttpg-panel-control-wrapper .rttpg-is-pro .components-form-toggle .components-form-toggle__thumb {
1406 background-color: #818181;
1407 border: #818181;
1408 }
1409
1410 /*Pro message style*/
1411 .rttpg-slider-layout-promotions {
1412 margin-bottom: 0;
1413 padding: 50px;
1414 background: #efefef;
1415 }
1416
1417 .rttpg-slider-layout-promotions,
1418 .rttpg-panel-control-wrapper .rttpg-get-pro-message-wrapper {
1419 text-align: center;
1420 padding-bottom: 15px;
1421 color: #6d7882;
1422 }
1423
1424 .rttpg-slider-layout-promotions h4,
1425 .rttpg-panel-control-wrapper .rttpg-get-pro-message-wrapper h4 {
1426 font-size: 16px;
1427 font-weight: 700;
1428 line-height: 1.4;
1429 color: #6d7882;
1430 }
1431
1432 .rttpg-slider-layout-promotions a,
1433 .rttpg-panel-control-wrapper .rttpg-get-pro-message-wrapper a {
1434 color: var(--rttpg-admin-red-color);
1435 }
1436
1437 .rttpg-slider-layout-promotions .rttpg-pro-message,
1438 .rttpg-panel-control-wrapper .rttpg-get-pro-message-wrapper .rttpg-pro-message {
1439 margin-bottom: 10px;
1440 }
1441
1442 .rttpg-slider-layout-promotions .rttpg-button-go-pro,
1443 .rttpg-panel-control-wrapper .rttpg-get-pro-message-wrapper .rttpg-button-go-pro {
1444 background-color: #0066ff;
1445 color: #fff;
1446 padding: 7px 25px;
1447 margin-top: 20px;
1448 -webkit-box-shadow: 0 0 1px rgb(0 0 0 / 10%), 0 2px 2px rgb(0 0 0 / 10%);
1449 box-shadow: 0 0 1px rgb(0 0 0 / 10%), 0 2px 2px rgb(0 0 0 / 10%);
1450 -webkit-transition: .5s;
1451 -o-transition: .5s;
1452 transition: .5s;
1453 display: inline-block;
1454 text-decoration: none;
1455 }
1456
1457 .rttpg-slider-layout-promotions .rttpg-button-go-pro:hover,
1458 .rttpg-panel-control-wrapper .rttpg-get-pro-message-wrapper .rttpg-button-go-pro:hover {
1459 background-color: #004ec5;
1460 color: #fff;
1461 }
1462
1463 .block-editor-inserter__preview-container .block-editor-inserter__preview-content {
1464 border-bottom: 1px solid #ddd;
1465 }
1466
1467 .block-editor-block-types-list[aria-label="The Post Grid"] .editor-block-list-item-rttpg-tpg-slider-layout img {
1468 transform: scale(1.3);
1469 }
1470
1471
1472 .rttpg-is-pro .rttpg-control-field .rttpg-cf-head .rt-left-part::after {
1473 content: "PRO";
1474 position: relative;
1475 color: #fff;
1476 background-color: red;
1477 padding: 1px 0 2px;
1478 display: inline-block;
1479 font-size: 8px;
1480 width: 26px;
1481 text-align: center;
1482 border-radius: 3px;
1483 margin-left: auto;
1484 font-weight: 500;
1485 margin-right: auto;
1486 line-height: 1.5;
1487 }
1488
1489 .rttpg-panel-control-wrapper .rttpg-is-pro .rttpg-control-field.rttpg-cf-range-wrap .components-range-control__wrapper {
1490 --wp-admin-theme-color: #ababab;
1491 --rttpg-admin-color-primary: #ababab;
1492 }
1493
1494 .rttpg-panel-control-wrapper .components-base-control__label {
1495 text-transform: none;
1496 }
1497
1498 .slider-arrow-position-top-left .swiper-navigation {
1499 left: 5px;
1500 }
1501
1502 .block-editor-block-inspector .block-editor-block-card img[alt='Grid Layout'],
1503 .block-editor-block-inspector .block-editor-block-card img[alt='Grid Hover Layout'],
1504 .block-editor-block-inspector .block-editor-block-card img[alt='List Layout'],
1505 .block-editor-block-inspector .block-editor-block-card img[alt='Slider Layout'] {
1506 padding-top: 12px;
1507 }
1508
1509 .rt-layout-filter-container .rt-layout-filter-container {
1510 margin: 0;
1511 }
1512
1513 .tpg-header-wrapper.carousel .rt-layout-filter-container .rt-layout-filter-container {
1514 flex: none;
1515 max-width: 100%;
1516 }
1517
1518 .wp-admin .slider-arrow-position-top-right .swiper-navigation {
1519 right: 6px;
1520 }
1521
1522 .wp-admin .slider-arrow-position-top-left .swiper-navigation {
1523 left: 6px;
1524 }
1525
1526 .rttpg-block-postgrid {
1527 font-size: 16px;
1528 }
1529
1530 /*RTTPG Import button style*/
1531 .edit-post-header__toolbar .rttpg-import-button-wrapper button.rttpg-import-btn {
1532 background: #002DCB linear-gradient(89.93deg, #002DCB 13.33%, #02A7FB 99.94%);
1533 color: #ffffff;
1534 border: none;
1535 min-height: 33px;
1536 transition: 0.4s;
1537 position: relative;
1538 z-index: 1;
1539 white-space: nowrap;
1540 overflow: hidden;
1541 margin-left: 15px;
1542 }
1543
1544 .edit-post-header__toolbar .rttpg-import-button-wrapper button.rttpg-import-btn::before {
1545 content: '';
1546 position: absolute;
1547 top: 0;
1548 left: 0;
1549 width: 100%;
1550 height: 100%;
1551 background: #002DCB linear-gradient(89.93deg, #02A7FB 13.33%, #002DCB 99.94%);
1552 z-index: -1;
1553 opacity: 0;
1554 transition: 0.4s;
1555 }
1556
1557 .edit-post-header__toolbar .rttpg-import-button-wrapper button.rttpg-import-btn:hover::before {
1558 opacity: 1;
1559 }
1560
1561 .edit-post-header__toolbar .rttpg-import-button-wrapper button.rttpg-import-btn:focus {
1562 outline: none;
1563 border: none;
1564 box-shadow: none;
1565 }
1566
1567 .edit-post-header__toolbar .rttpg-import-button-wrapper button.rttpg-import-btn svg {
1568 margin-right: 10px;
1569 margin-top: -3px;
1570 }
1571
1572 /*TODO: Row CSS*/
1573
1574 .rttpg-block .block-list-appender .components-button.block-editor-button-block-appender {
1575 border: 1px solid #e9e9e9;
1576 box-shadow: none;
1577 color: #484b4a;
1578 }
1579
1580 .rttpg-container-variation-picker .block-editor-block-variation-picker__variations {
1581 max-width: 750px;
1582 margin: auto;
1583 justify-content: center;
1584 align-items: center;
1585 }
1586
1587 .rttpg-container-variation-picker .block-editor-block-variation-picker__variations li {
1588 margin: 8px 10px;
1589 text-align: center;
1590 }
1591
1592 .rttpg-container-variation-picker .block-editor-block-variation-picker__variations li button {
1593 color: #a3a5ab !important;
1594 box-shadow: inset 0 0 0 1px #a3a5a9 !important;
1595 padding: 0 10px !important;
1596 }
1597
1598 .rttpg-panel-control-wrapper .rttpg-custom-alignment .rttpg-control-field.rttpg-cf-alignment-wrap {
1599 flex-direction: column;
1600 }
1601
1602 .rttpg-panel-control-wrapper .rttpg-custom-alignment .rttpg-control-field .rttpg-button svg {
1603 max-width: 18px !important;
1604 height: auto !important;
1605 }
1606
1607 .rttpg-block-postgrid .rt-pagination-wrap {
1608 width: 100% !important;
1609 }
1610
1611 .ajax-pagination-type-next-prev-yes .rt-pagination .pagination-list a {
1612 color: #ffffff;
1613 background-color: var(--tpg-primary-color, #0d6efd);
1614 }
1615
1616 .wp-block-social-links.is-style-logos-only.is-content-justification-left li {
1617 flex: 1 !important;
1618 }
1619
1620 [data-type="core/widget-area"] .rttpg-block-wrapper {
1621 margin-left: 0;
1622 margin-right: 0;
1623 }
1624
1625 .components-base-control.rttpg-repeater {
1626 position: relative;
1627 z-index: 99;
1628 }
1629
1630 .rttpg-repeater #react-select-2-listbox {
1631 position: relative;
1632 z-index: 9999;
1633 }
1634
1635 .rttpg-toc-headings-list {
1636 display: flex;
1637 flex-wrap: wrap;
1638 align-items: baseline;
1639 gap: 4px;
1640 }
1641
1642 .rttpg-toc-headings-list .components-base-control {
1643 margin: 0;
1644 font-weight: 400;
1645 font-size: 14px;
1646 border: 1px solid #c7c7c7;
1647 padding: 5px 4px;
1648 border-radius: 3px;
1649 box-sizing: border-box;
1650 flex: 1 0 auto;
1651 }
1652
1653 .rttpg-toc-headings-list .components-base-control > div,
1654 .rttpg-toc-headings-list .components-base-control .components-base-control__field {
1655 display: flex;
1656 flex-direction: column-reverse;
1657 justify-content: center;
1658 align-items: center;
1659 gap: 5px;
1660 }
1661
1662 .rttpg-toc-headings-list .components-base-control * {
1663 margin-left: 0;
1664 margin-right: 0;
1665 padding-left: 0;
1666 padding-right: 0;
1667 }
1668
1669 .rttpg-toc-headings-list .components-checkbox-control__input[type=checkbox] {
1670 border-radius: 50%;
1671 }