PluginProbe
VikBooking Hotel Booking Engine & PMS / 1.7.0
VikBooking Hotel Booking Engine & PMS v1.7.0
1.8.16 1.8.15 1.8.14 1.8.13 1.8.12 1.8.11 1.8.10 1.8.9 1.8.6 1.8.7 1.8.8 trunk 1.6.0 1.6.1 1.6.2 1.6.3 1.6.4 1.6.5 1.6.6 1.6.7 1.6.8 1.6.9 1.7.0 1.7.1 1.7.2 All 37 releases
vikbooking / admin / resources / vbo-appearance-auto.css

vbo-appearance-auto.css in VikBooking Hotel Booking Engine & PMS 1.7.0, at admin/resources/vbo-appearance-auto.css

1,141 lines 44.8 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 /*
2 * Vik Booking - Colors adaptation for "Automatic Light/Dark" Appearance .
3 * Media queries should detect the OS/Browser preferences for the Dark Color Scheme
4 * and override the CSS variables within that preference.
5 *
6 * @note the variables of this file should be identical to the ones of the file vcm-appearance-dark.css
7 */
8
9 /* Variable declarations when a dark color scheme is preferred. */
10 @media (prefers-color-scheme: dark) {
11 :root {
12
13 /* WordPress variables */
14 --wp-btn-color: #92c4ee;
15 --wp-btn-color-hover: #2e7aaf;
16
17 /* body color */
18 --vbo-body-bg-color: #0f1216;
19 --vbo-main-bg-color: #0f1216;
20 --vbo-body-text-color: rgba(255, 255, 255, 0.87);
21
22 /* main bg and text color */
23 --vbo-container-text-color:rgba(255, 255, 255, 0.87);
24 --vbo-contrast-text-color: rgba(255, 255, 255, 0.87);
25 --vbo-base-color: #4e8abb; /* #6096c2 */
26 --vbo-base-color-hover: #2c6fa5;
27 --vbo-link-text-color: #92c4ee;
28 --vbo-basic-btn: #181b22;
29 --vbo-basic-btn-hover: #303942;
30 --vbo-basic-btn-focus: #444;
31 --vbo-light-color-btn: #303942;
32 --vbo-middle-color-btn: #262f39;
33 --vbo-grey-blue-bg: #424954;
34 --vbo-light-blue: #313f4d;
35
36 /* Config bg and text color */
37 --vbo-config-bg-color: #282b33;
38 --vbo-config-bg-dark: #666;
39 --vbo-input-style: #282b33;
40 --vbo-config-text-color: inherit;
41 --vbo-config-border-color: #0f1216;
42 --vbo-config-titles-color-light: rgba(255, 255, 255, 0.77);
43 --vbo-config-child-bg-color: #181b22;
44 --vbo-config-text-color-light: rgba(255, 255, 255, 0.77);
45 --vbo-config-title-color: rgba(255, 255, 255, 0.60);
46
47 /* Input Style */
48 --vbo-input-style: #1e222b;
49 --vbo-input-style-deactive: #282b33;
50 --vbo-input-style-nested-deactive: #181b22;
51
52 /* Page Lists */
53 --vbo-toolbar-bg-color: rgba(212, 218, 229, 0.1);
54
55 /* General Colors */
56 --vbo-red-color: #da5f5f;
57 --vbo-red-color-hover: #f38a8a;
58 --vbo-orange-color: #d09754;
59 --vbo-orange-color-hover: #be8340;
60 --vbo-green-color: #489e48;
61 --vbo-green-color-hover: #428242;
62 --vbo-green-color-focus: #65c265;
63 --vbo-light-green-color: #4e754c;
64 --vbo-light-green-color-hover: #365335;
65 --vbo-blue-color: #2f6f8e;
66 --vbo-blue-color-hover: #498fb3;
67 --vbo-gold-color: #ccc450;
68 --vbo-purple-color: #b746df;
69
70 /* Notification Status */
71 --vbo-info-bg: #5488b0;
72 --vbo-info-border: #4e7891;
73 --vbo-warning-bg: #ffe8bb;
74 --vbo-warning-bg-txt: #df7212;
75 --vbo-warning-border: #d99323;
76 --vbo-error-bg: #eab0b0;
77 --vbo-error-txt: #800;
78 --vbo-error-border: #ea6060;
79
80 /* VCM Chat Message */
81 --vcm-chat-bubble-host-background: #50575d;
82 --vcm-chat-bubble-host-color: #fff;
83 --vcm-chat-bubble-guest-background: #3c404c;
84 --vcm-chat-bubble-guest-color: #fff;
85 --vcm-chat-dot-flashing-on: #ddd;
86 --vcm-chat-dot-flashing-off: rgba(221, 221, 221, 0.2);
87 }
88 body {
89 background: var(--vbo-body-bg-color) !important;
90 color: var(--vbo-body-text-color) !important;
91 }
92 h2, h3 {
93 color: var(--vbo-config-text-color-light);
94 }
95 .label, .badge {
96 background-color: #666;
97 }
98 table.table th, table.table td {
99 background: var(--vbo-config-bg-color);
100 border-top: 1px solid var(--vbo-config-border-color);
101 border-bottom: 0;
102 }
103 .vbo-bookingslist-table thead, .vbo-list-table thead {
104 border-bottom: 0;
105 }
106 .vbo-bookingslist-table thead tr, .vbo-list-table thead tr {
107 border: 0;
108 }
109 .vbo-bookingslist-table.table > :not(:first-child), .vbo-list-table.table > :not(:first-child) {
110 border: 0;
111 }
112 .table tbody tr.warning > td, .table tr.no-results > td {
113 background-color: #5e5b4c !important;
114 }
115 .vbo-list-table tbody > tr > td, .vbo-list-table tbody > tr > th {
116 border-top: 1px solid var(--vbo-config-border-color) !important;
117 }
118 .btn.vbo-btn-black {
119 background: var(--vbo-config-bg-dark);
120 border: 1px solid #999;
121 }
122
123 /* Config tabs */
124 .vbo-config-tabs-wrap dl.tabs {
125 border-bottom: 1px solid var(--vbo-light-color-btn);
126 }
127
128 /* Color action buttons */
129 .jtoolbar .page-title-action {
130 background: transparent;
131 color: var(--wp-btn-color);
132 border-color: var(--wp-btn-color);
133 }
134 .jtoolbar .page-title-action:hover {
135 background: transparent;
136 color: var(--wp-btn-color-hover);
137 border-color: var(--wp-btn-color-hover);
138 }
139 .fancybox-wrap .fancybox-skin {
140 background: var(--vbo-body-bg-color);
141 }
142 /* @WP style */
143 /* Plugin name */
144 .wrap h1.wp-heading-inline {
145 color: var(--vbo-body-text-color)
146 }
147 /* Arrow active WP menu on the left */
148 ul#adminmenu a.wp-has-current-submenu::after, ul#adminmenu > li.current > a.current::after {
149 border-right-color: var(--vbo-body-bg-color);
150 }
151 .wp-core-ui select {
152 background: var(--vbo-input-style) url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20width%3D%2220%22%20height%3D%2220%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M5%206l5%205%205-5%202%201-7%207-7-7%202-1z%22%20fill%3D%22%23474c5b%22%2F%3E%3C%2Fsvg%3E') no-repeat right 5px top 55%;
153 color: inherit;
154 border-color: var(--vbo-config-border-color);
155 }
156 .wp-core-ui .button, .wp-core-ui .button-secondary, .vbo-guestactivitywidget-commands .vbo-guestactivitywidget-command-chevron > span, .vbo-reportwidget-command-chevron > span, .vbo-dash-chart-title .vbo-dash-chart-nav {
157 background: var(--vbo-basic-btn) !important;
158 color: var(--vbo-config-title-color) !important;
159 border-color: var(--vbo-config-border-color);
160 }
161 .wp-core-ui .button-disabled, .wp-core-ui .button-secondary.disabled, .wp-core-ui .button-secondary:disabled, .wp-core-ui .button-secondary[disabled], .wp-core-ui .button.disabled, .wp-core-ui .button:disabled, .wp-core-ui .button[disabled] {
162 border: 1px solid var(--vbo-light-color-btn) !important;
163 background: var(--vbo-config-bg-color) !important;
164 border-color: var(--vbo-contrast-text-color);
165 }
166 .wp-core-ui .button-secondary:hover, .wp-core-ui .button.hover, .wp-core-ui .button:hover, .vbo-guestactivitywidget-commands .vbo-guestactivitywidget-command-chevron > span:not(.vbo-guestactivitywidget-page):hover, .vbo-reportwidget-command-chevron > span:hover, .vbo-dash-chart-title .vbo-dash-chart-nav:hover {
167 border-color: var(--wp-btn-color) !important;
168 color: var(--wp-btn-color) !important;
169 }
170 .wp-core-ui select.disabled, .wp-core-ui select:disabled {
171 background-color: var(--vbo-input-style-deactive);
172 color: var(--vbo-config-text-color-light);
173 }
174 .wp-core-ui select.disabled, .wp-core-ui select:disabled, input.disabled, input:disabled, select.disabled, select:disabled, textarea.disabled, textarea:disabled {
175 background: var(--vbo-config-bg-color);
176 border-color: var(--vbo-config-border-color);
177 }
178 .wp-editor-wrap .wp-editor-container, .wp-editor-wrap .quicktags-toolbar {
179 border-color: var(--vbo-config-border-color);
180 }
181 .wp-editor-wrap .quicktags-toolbar {
182 background: var(--vbo-middle-color-btn);
183 }
184 .mce-tinymce div.mce-panel {
185 background: var(--vbo-input-style);
186 }
187 .mce-tinymce div.mce-toolbar-grp {
188 border-bottom: 1px solid var(--vbo-config-border-color);
189 background: var(--vbo-middle-color-btn);
190 }
191 .wp-editor-wrap .wp-editor-tabs .wp-switch-editor {
192 background: var(--vbo-input-style);
193 border-color: var(--vbo-config-border-color);
194 color: inherit;
195 }
196 .wp-editor-wrap.html-active .switch-html, .wp-editor-wrap.tmce-active .switch-tmce {
197 background: var(--vbo-middle-color-btn);
198 border-color: var(--vbo-config-border-color);
199 border-bottom-color: var(--vbo-middle-color-btn);
200 color: inherit;
201 }
202 .mce-tinymce .mce-btn button, .mce-tinymce .mce-toolbar .mce-ico {
203 color: var(--vbo-config-title-color);
204 }
205 .mce-tinymce .mce-toolbar .mce-btn-group .mce-btn.mce-listbox {
206 background: var(--vbo-input-style-nested-deactive);
207 border-color: var(--vbo-config-border-color);
208 color: inherit;
209 }
210 .mce-tinymce .mce-toolbar .mce-btn-group .mce-btn.mce-listbox:hover, .mce-tinymce .mce-toolbar .mce-btn-group .mce-btn.mce-listbox:focus {
211 background: var(--vbo-input-style);
212 border-color: var(--vbo-config-border-color);
213 color: inherit;
214 }
215 .mce-tinymce .mce-panel .mce-btn i.mce-caret {
216 border-top-color: inherit;
217 }
218 .mce-tinymce .mce-panel .mce-btn:focus i.mce-caret, .mce-tinymce .mce-panel .mce-btn:hover i.mce-caret {
219 border-top-color: var(--vbo-contrast-text-color);
220 }
221 .mce-tinymce .mce-panel .mce-active i.mce-caret {
222 border-bottom-color: var(--vbo-contrast-text-color);
223 }
224 .mce-panel.mce-menu {
225 border-color: var(--vbo-config-border-color) !important;
226 background: var(--vbo-input-style);
227 }
228 .mce-menu .mce-menu-item.mce-active.mce-menu-item-normal, .mce-menu .mce-menu-item.mce-active.mce-menu-item-preview, .mce-menu .mce-menu-item.mce-selected, .mce-menu .mce-menu-item:focus, .mce-menu .mce-menu-item:hover {
229 background: var(--vbo-base-color);
230 }
231 .mce-tinymce .mce-toolbar .mce-btn-group .mce-btn:focus, .mce-tinymce .mce-toolbar .mce-btn-group .mce-btn:hover, .qt-dfw:focus, .qt-dfw:hover {
232 background: var(--vbo-input-style);
233 border-color: var(--vbo-input-style);
234 color: var(--vbo-base-color);
235 box-shadow: none;
236 }
237 .mce-tinymce .mce-toolbar .mce-btn-group .mce-btn.mce-active, .mce-tinymce .mce-toolbar .mce-btn-group .mce-btn:active, .qt-dfw.active {
238 background: var(--vbo-input-style);
239 border-color: var(--vbo-config-border-color);
240 color: var(--vbo-base-color);
241 }
242 .vik-contentbuilder-editor-container .ql-editor h1 {
243 color: inherit;
244 font-weight: bold;
245 }
246 .vik-contentbuilder-editor-container .vbo-editor-hl-specialtag {
247 background-color: rgba(59, 193, 255, 0.3);
248 }
249 /* @WP End */
250 .popover, .popover-title {
251 color: var(--vbo-body-text-color);
252 }
253 .popover.right .arrow::after {
254 border-right-color: var(--vbo-light-color-btn) !important;
255 }
256 input.readonly, input[readonly], textarea.readonly, textarea[readonly], input[type="color"], input[type="date"], input[type="datetime-local"], input[type="datetime"], input[type="email"], input[type="month"], input[type="number"], input[type="password"], input[type="search"], input[type="tel"], input[type="text"], input[type="time"], input[type="url"], input[type="week"], select, textarea {
257 background-color: var(--vbo-input-style) !important;
258 border-color: var(--vbo-config-border-color) !important;
259 color: var(--vbo-container-text-color) !important;
260 }
261 input[type="color"]:focus, input[type="date"]:focus, input[type="datetime-local"]:focus, input[type="datetime"]:focus, input[type="email"]:focus, input[type="month"]:focus, input[type="number"]:focus, input[type="password"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="text"]:focus, input[type="time"]:focus, input[type="url"]:focus, input[type="week"]:focus, select:focus, textarea:focus {
262 background: var(--vbo-config-child-bg-color);
263 }
264 .comment-ays, .feature-filter, .imgedit-group, .popular-tags, .stuffbox, .widgets-holder-wrap, .wp-editor-container, p.popular-tags, table.widefat {
265 background: var(--vbo-config-bg-color);
266 }
267 .widefat tfoot tr td, .widefat tfoot tr th, .widefat thead tr td, .widefat thead tr th {
268 color: var(--vbo-config-text-color-light);
269 }
270 .widefat td, .widefat th {
271 color: inherit;
272 }
273 /*.select2-container--default .select2-selection--multiple {
274 background-color: var(--vbo-input-style) !important;
275 }*/
276 .select2-container .select2-choice {
277 background: var(--vbo-input-style) !important;
278 border: 1px solid var(--vbo-config-border-color) !important;
279 color: var(--vbo-body-text-color) !important;
280 }
281 .select2-container .select2-choice .select2-arrow {
282 background-image: none !important;
283 background: #272c37 !important;
284 border-left: 1px solid #333 !important;
285 }
286 .notice, div.error, div.updated {
287 background: var(--vbo-config-bg-color);
288 border-top: 1px solid var(--vbo-light-color-btn);
289 border-right: 1px solid var(--vbo-light-color-btn);
290 border-bottom: 1px solid var(--vbo-light-color-btn);
291 }
292 body a {
293 color: var(--vbo-link-text-color);
294 }
295 body a:hover {
296 color: var(--vbo-base-color-hover);
297 }
298 body code, body pre {
299 background: var(--vbo-config-bg-color);
300 color: inherit;
301 }
302 /* Error Messages */
303 .warn {
304 border: 1px solid rgba(249, 233, 169, 0.5) !important;
305 background-color: rgba(249, 233, 169, 0.2) !important;
306 }
307 .info {
308 border: 1px solid rgba(142, 227, 255, 0.6) !important;
309 background-color: rgba(223, 247, 255, 0.3) !important;
310 }
311 .err {
312 border: 1px solid rgb(216, 0, 12, .3) !important;
313 background-color: rgba(255, 216, 216, 0.2) !important;
314 }
315 .bluedays {
316 background: var(--vbo-light-color-btn) !important;
317 }
318 .bluedays.vbo-tablewday-wend {
319 background: var(--vbo-middle-color-btn) !important;
320 }
321 .block-picked-start, .block-picked-middle, .block-picked-end {
322 background: rgba(255, 196, 153, 0.5);
323 }
324 .ui-widget-content a {
325 color: inherit;
326 }
327
328 .popover {
329 background: var(--vbo-light-color-btn) !important;
330 }
331 .popover.right > .bs-arrow::after {
332 border-right-color: var(--vbo-light-color-btn) !important;
333 }
334 .popover.left > .bs-arrow::after {
335 border-left-color: var(--vbo-light-color-btn) !important;
336 }
337 .popover.bottom > .bs-arrow::after {
338 border-bottom-color: var(--vbo-light-color-btn) !important;
339 }
340 .popover.top > .bs-arrow::after {
341 border-top-color: var(--vbo-light-color-btn) !important;
342 }
343 .popover-title {
344 background-color: var(--vbo-config-child-bg-color) !important;
345 border-bottom: 1px solid var(--vbo-config-child-bg-color) !important;
346 }
347 code, kbd {
348 background: var(--vbo-config-bg-color);
349 }
350
351 /* vbo */
352 .vbo-admin-widget-sticky-notes-wrap .vbo-admin-widget-sticky-notes-list > li {
353 background: #a9d4ee;
354 }
355 .vbo-admin-widget-sticky-notes-wrap .vbo-admin-widget-sticky-notes-list > li:hover, .vbo-admin-widget-sticky-notes-wrap .vbo-admin-widget-sticky-notes-list .vbo-sticky-note-add {
356 background: #c4dbea;
357 }
358 .vbo-admin-widget-sticky-notes-wrap .vbo-admin-widget-sticky-notes-list .vbo-sticky-note-add {
359 border: 2px solid #a9d4ee;
360 }
361 .vbo-admin-widget-sticky-notes-wrap .vbo-admin-widget-sticky-notes-list .vbo-sticky-note-add:hover, .vbo-admin-widget-sticky-notes-wrap .vbo-admin-widget-sticky-notes-list .vbo-sticky-note-add .vbo-sticky-note-add-inner:hover {
362 background: #a9d4ee;
363 }
364 .vbo-admin-widget-sticky-notes-wrap .vbo-admin-widget-sticky-notes-list .vbo-sticky-note a {
365 color: #056dc3;
366 }
367 .vbo-skeleton-loading {
368 background: var(--vbo-basic-btn);
369 }
370 .vbo-skeleton-loading:after {
371 background-image: linear-gradient(90deg, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0.2) 20%, rgba(0, 0, 0, 0.5) 60%, rgba(0, 0, 0, 0));
372 }
373 .vbo-dashboard-chart-container {
374 box-shadow: 0 0 20px rgba(0,0,0,.2);
375 }
376 .vbo-admin-widgets-list-customize .vbo-admin-widgets-section, .vbo-widgets-welcome-demo .vbo-widgets-welcome-demo-section {
377 background: #55626f;
378 }
379 .vbo-admin-widgets-list-customize .vbo-admin-widgets-section .vbo-admin-widgets-container, .vbo-widgets-welcome-demo .vbo-widgets-welcome-demo-container {
380 background: #6a848e;
381 }
382 .vbo-admin-widgets-list-customize .vbo-admin-widgets-section .vbo-admin-widgets-container.vbo-admin-widgets-container-addnew:hover,
383 .vbo-admin-widgets-widget-addnew .vbo-admin-widgets-plus-box:hover, .vbo-admin-widgets-section.vbo-admin-widgets-section-addnew .vbo-admin-widgets-plus-box:hover, .vbo-admin-widgets-container-addnew .vbo-admin-widgets-plus-box:hover {
384 background: #2c6880;
385 }
386 .vbo-admin-widgets-list-customize .vbo-admin-widgets-section .vbo-admin-widgets-container.vbo-admin-widgets-container-addnew .vbo-admin-widgets-plus-box, .vbo-admin-widgets-section.vbo-admin-widgets-section-addnew {
387 color: var(--vbo-config-text-color-light);
388 }
389 .vbo-admin-widgets-list-customize .vbo-admin-widget-elem-cmds, .vbo-admin-widgets-list-customize .vbo-admin-widgets-widget-remove {
390 color: #eee;
391 }
392 .vbo-widgets-welcome-demo .vbo-widgets-welcome-demo-widget {
393 background: var(--vbo-config-bg-color);
394 }
395 .vbo-tinymce-modal {
396 background-color: var(--vbo-config-bg-color);
397 }
398 .vbo-tinymce-modal form h1 {
399 background: var(--vbo-config-child-bg-color);
400 border-color: var(--vbo-config-border-color);
401 color: inherit;
402 }
403 .vbo-tinymce-modal .shortcodes-group {
404 border-color: var(--vbo-config-border-color);
405 }
406 .vbo-tinymce-modal .shortcode-record {
407 background-color: var(--vbo-toolbar-bg-color);
408 border-color: var(--vbo-config-border-color);
409 }
410 .vbo-tinymce-modal .shortcode-record.selected {
411 background-color: var(--vbo-light-color-btn);
412 }
413 .vbo-tinymce-modal .vbo-tinymce-submitbox {
414 border-color: var(--vbo-config-border-color);
415 background: var(--vbo-config-child-bg-color);
416 }
417 .vbo-tinymce-modal .vbo-tinymce-submitbox #vbo-tinymce-cancel button {
418 background-color: var(--vbo-basic-btn) !important;
419 border-color: var(--vbo-config-border-color);
420 }
421 .vbo-tinymce-modal .vbo-tinymce-submitbox #vbo-tinymce-cancel button:hover {
422 background-color: var(--vbo-basic-btn-hover) !important;
423 }
424 .vbo-tinymce-modal .vbo-tinymce-submitbox #vbo-tinymce-update button {
425 background-color: var(--vbo-green-color) !important;
426 border-color: var(--vbo-green-color);
427 color: inherit inherit;
428 }
429 .vbo-tinymce-modal .vbo-tinymce-submitbox #vbo-tinymce-update button:hover {
430 background-color: var(--vbo-green-color-hover) !important;
431 }
432 .vbo-inspector-wrap {
433 background-color: rgba(255, 255, 255, 0.94);
434 }
435 .vbo-roverview-datecmd-top .vbo-roverview-datecmd-date {
436 background: var(--vbo-input-style);
437 border: 1px solid var(--vbo-config-border-color);
438 }
439 .vbo-roverviewrowone .vbo-roverv-festcell, .notbusy.vbo-overv-festcell, .subnotbusy.vbo-overv-festcell, .bluedays.vbo-overv-festcell, .vbo-tableaux-festcell {
440 background-color: #6f5a6b !important;
441 }
442 .vbo-roverviewrowone .vbo-roverv-festcell:hover, .notbusy.vbo-overv-festcell:hover, .subnotbusy.vbo-overv-festcell:hover, .bluedays.vbo-overv-festcell:hover, .vbo-tableaux-festcell:hover {
443 background-color: #80667c !important;
444 }
445 .vbo-roverviewrowone .vbo-roverv-festcell:active, .notbusy.vbo-overv-festcell:active, .subnotbusy.vbo-overv-festcell:active, .bluedays.vbo-overv-festcell:active, .vbo-tableaux-festcell:active,
446 .vbo-roverviewrowone .vbo-roverv-festcell:focus, .notbusy.vbo-overv-festcell:focus, .subnotbusy.vbo-overv-festcell:focus, .bluedays.vbo-overv-festcell:focus, .vbo-tableaux-festcell:focus {
447 background-color: #513d4e !important;
448 }
449 .notbusy.vbo-overv-todaycell, .subnotbusy.vbo-overv-todaycell, .bluedays.vbo-overv-todaycell, .vbo-tableaux-table .vbo-tableaux-todaycell {
450 background-color: #6889ab !important;
451 }
452 .vboverviewtablerow .vbo-partially, .vbo-overview-legend-yellow .vbo-overview-legend-box {
453 background: none repeat scroll 0 0 #c2770d !important;
454 }
455 .bluedays.vbo-roverw-tablewday-wend {
456 background: var(--vbo-middle-color-btn) !important;
457 }
458 .vbo-calcrates-rateblock {
459 background-color: var(--vbo-input-style);
460 }
461 .vbo-avcalendars-wrapper .vbo-calendar-cal-container .vbadmincaltable {
462 background-color: var(--vbo-light-color-btn);
463 }
464 .vbo-overview-tip-bookingcont-left {
465 background-color: rgba(60, 62, 67);
466 }
467 .vbo-overview-tip-bookingcont-right {
468 background-color: rgba(90, 90, 90);
469 }
470 .vbo-overview-tip-bookingcont .vbo-overview-tip-lbl {
471 color: rgb(190, 216, 235);
472 }
473 .vbo-overview-tip-bctag-subtip {
474 background-color: rgb(92, 92, 92);
475 }
476 .vbo-overview-tip-bctag-subtip:before {
477 border-color: transparent rgb(92, 92, 92) transparent transparent;
478 }
479 .vbo-bookingdet-command .btn.vbo-config-btn {
480 border: 1px solid #434650;
481 }
482 .vbo-dropfiles-target {
483 color: var(--vbo-config-text-color-light) !important;
484 background-color: var(--vbo-config-child-bg-color) !important;
485 border-color: var(--vbo-config-border-color);
486 }
487 .btn.vbo-condtext-specialtag-btn {
488 background-color: #181b1d;
489 border: 1px solid var(--vbo-config-border-color);
490 }
491 .viwpro-procnt .vikwppro-licencecnt {
492 background: #204255;
493 }
494 .viwpro-procnt .viwpro-procnt-inner {
495 border: 2px solid #54708e;
496 }
497 .vikwppro-licenceform:after {
498 border-color: transparent transparent transparent #204255;
499 }
500 .vbo-insertrates-cont > div {
501 background-color: var(--vbo-basic-btn-hover);
502 }
503 .vikpro-e4jc-badgeimg img {
504 background: #101010;
505 padding: 4px;
506 border-radius: 4px;
507 }
508 .viwpro-e4jc-channels .viwpro-e4jc-channels-inner {
509 background: #101010;
510 margin: 20px;
511 border-radius: 4px;
512 }
513 .vikwppro-download-progress progress[value]::-moz-progress-bar, .vikwppro-download-progress progress[value]::-webkit-progress-bar {
514 background: #265f8c;
515 }
516 .vbo-overview-tiploading {
517 background-color: rgba(58,58,58, .9);
518 }
519 .vbo-room-channels-mapped-wrap .vbo-room-channels-mapped-ch {
520 background: rgba(0,0,0,.4);
521 }
522 #progress.progress {
523 background: var(--vbo-config-child-bg-color);
524 background-image: none;
525 }
526 .vbo-custsearchres-entry-highligthed {
527 background: var(--vbo-config-child-bg-color);
528 }
529 .vbo-translations-lim-wrap table select {
530 background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='%23474c5b' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E") no-repeat right .55rem center;
531 background-color: var(--vbo-input-style) !important;
532 background-size: 8px 10px;
533 }
534 .vbo-roverw-daymod-infospids-outcont {
535 background: var(--vbo-main-bg-color) none repeat scroll 0 0;
536 }
537 .vbo-ratesoverview-period-box-cals-inner {
538 background: var(--vbo-basic-btn);
539 }
540 .vbo-timeline-radio:checked + .vbo-timeline-relative .vbo-timeline-circle {
541 background: #fff;
542 }
543 /* VikBooking Chat */
544 .chat-border-layout .chat-threads-panel {
545 border-color: var(--vbo-basic-btn) !important;
546 }
547 .chat-threads-list li {
548 border-color: var(--vbo-config-border-color) !important;
549 background: var(--vbo-config-bg-color) !important;
550 }
551 .chat-threads-list li.active {
552 background-color: #3c404c !important;
553 border-color: var(--vbo-config-border-color) !important;
554 }
555 .chat-threads-list li:not(.active):hover {
556 background-color: #2e323d !important;
557 }
558 .chat-input-footer .textarea-input .chat-action-btn {
559 color: var(--vbo-config-title-color) !important;
560 }
561 .chat-input-footer .textarea-input .chat-action-btn:hover {
562 color: var(--vbo-base-color) !important;
563 }
564 .chat-conversation .chat-message .speech-bubble.received {
565 background: #3c404c !important;
566 color: #fff !important;
567 }
568 .chat-conversation .chat-message .speech-bubble.sent {
569 background: #50575d !important;
570 }
571 .chat-input-footer .chat-uploads-bar .chat-attachment {
572 background-color: var(--vbo-light-color-btn) !important;
573 border-color: var(--vbo-config-border-color) !important;
574 }
575 .chat-conversation .chat-message .speech-bubble.sent.ai-reply:before {
576 background: #50575d !important;
577 }
578 .chat-conversation .chat-message .speech-bubble.sent ~ .reactions {
579 background: #50575d !important;
580 border: 1px solid #898e93 !important;
581 }
582 .chat-conversation .chat-message .speech-bubble.received ~ .reactions {
583 background: #3c404c !important;
584 border: 1px solid #72757c !important;
585 }
586 /* VikBooking Telephone */
587 .iti__country-list {
588 background: var(--vbo-config-bg-color);
589 border-color: var(--vbo-config-border-color);
590 }
591 .iti__country.iti__highlight {
592 background-color: var(--vbo-light-color-btn);
593 }
594 /* Content Builder */
595 .ql-toolbar.ql-snow + .ql-container.ql-snow {
596 background: var(--vbo-middle-color-btn);
597 }
598
599 /* @Joomla */
600 body.admin #status {
601 background: var(--vbo-config-bg-color);
602 color: var(--vbo-config-title-color);
603 border-color: var(--vbo-config-border-color);
604 }
605 body .btn {
606 background: var(--vbo-basic-btn);
607 border: 1px solid var(--vbo-config-border-color);
608 color: var(--vbo-body-text-color);
609 }
610 body .btn:hover, body .btn:focus {
611 background-color: var(--vbo-basic-btn-hover);
612 border-color: var(--vbo-config-border-color);
613 color: var(--vbo-body-text-color);
614 }
615 body .btn-success {
616 background: var(--vbo-green-color);
617 border: 1px solid var(--vbo-green-color);
618 }
619 body .btn-success:hover {
620 background: var(--vbo-green-color-hover);
621 border: 1px solid var(--vbo-green-color-hover);
622 }
623 body .btn-success:focus, body .btn-success:active {
624 background: var(--vbo-green-color-focus);
625 border: 1px solid var(--vbo-green-color-focus);
626 }
627 body.admin #content .btn:hover, body.admin #content .btn:focus {
628 background: var(--vbo-basic-btn-hover);
629 border: 1px solid var(--vbo-config-bg-color);
630 color: var(--vbo-body-text-color);
631 }
632 body.admin .pagination ul > li > a, .pagination ul > li > span {
633 background: var(--vbo-basic-btn) !important;
634 color: var(--vbo-config-title-color) !important;
635 border-color: var(--vbo-config-border-color);
636 }
637 body.admin .pagination ul > li.disabled > a, body.admin .pagination ul > li.disabled > span {
638 border: 1px solid var(--vbo-light-color-btn) !important;
639 background: var(--vbo-config-bg-color) !important;
640 border-color: var(--vbo-contrast-text-color);
641 }
642 body.admin .pagination ul > li.active > span, body.admin .pagination ul > li > a:hover, .pagination ul > li > span:hover {
643 border-color: var(--vbo-config-border-color);
644 background: var(--vbo-config-border-color) !important;
645 }
646 body.admin .calendar-container {
647 background: var(--vbo-config-bg-color) !important;
648 }
649 body.admin .calendar-container table tbody td.day.wn {
650 background: var(--vbo-config-bg-color);
651 }
652 body.admin .calendar-container table tbody td.disabled {
653 background: var(--vbo-input-style-deactive);
654 }
655 body.admin .input-append .add-on, .input-prepend .add-on {
656 background: var(--vbo-basic-btn);
657 border-color: var(--vbo-config-border-color);
658 }
659 body.admin .subhead {
660 background: var(--vbo-config-bg-color);
661 border-color: var(--vbo-config-border-color);
662 color: inherit;
663 }
664 /*
665 body.admin #toolbar div:not(#toolbar-new, #toolbar-apply) [class^="icon-"], body.admin #toolbar div:not(#toolbar-new, #toolbar-apply) [class*=" icon-"] {
666 background: var(--vbo-basic-btn);
667 border-right: 1px solid var(--vbo-config-bg-color);
668 }
669 */
670 body.admin #toolbar div:not(#toolbar-new, #toolbar-apply) .btn:hover, body.admin #toolbar div:not(#toolbar-new, #toolbar-apply) .btn:focus {
671 background: var(--vbo-basic-btn-hover);
672 border: 1px solid var(--vbo-config-bg-color) !important;
673 }
674 body.admin #toolbar .btn-success {
675 background: var(--vbo-green-color);
676 }
677 body.admin #toolbar .btn-success:hover {
678 background: var(--vbo-green-color-hover);
679 }
680 body.admin #toolbar .btn-success:focus, body.admin #toolbar .btn-success:active {
681 background: var(--vbo-green-color-focus);
682 }
683 body.admin #toolbar .dropdown-toggle-split {
684 border-color: var(--vbo-config-border-color);
685 }
686 body.admin #toolbar .dropdown-toggle-split .icon-chevron-down {
687 background: transparent !important;
688 border: 0 !important;
689 color: #fff;
690 }
691 body.admin #toolbar .btn-group .dropdown-menu {
692 background: var(--vbo-config-bg-color);
693 border-color: var(--vbo-config-border-color);
694 }
695 body.admin #toolbar .btn-group .dropdown-menu:hover {
696 background: var(--vbo-basic-btn-hover);
697 border: 1px solid var(--vbo-config-bg-color);
698 }
699 body.admin #toolbar .btn-group .dropdown-menu .dropdown-item > span {
700 background: transparent !important;
701 border: 0 !important;
702 }
703 .table-responsive > .table > thead > tr > th, .table-responsive > .table > tbody > tr > th, .table-responsive > .table > tfoot > tr > th, .table-responsive > .table > thead > tr > td, .table-responsive > .table > tbody > tr > td, .table-responsive > .table > tfoot > tr > td {
704 color: var(--vbo-body-text-color);
705 }
706 body.admin .modal-header {
707 background: var(--vbo-body-bg-color);
708 border-bottom: 1px solid var(--vbo-config-bg-color) !important;
709 }
710 body.admin .modal-header .close {
711 color: #fff;
712 }
713 body.admin .label, .badge {
714 background-color: #666;
715 }
716 body.admin .label.label-info, .label.label-info, .badge.badge-info {
717 background: var(--vbo-info-bg) !important;
718 color: #fff;
719 }
720 body.admin .label-info:hover, .label-info:hover, .badge-info:hover {
721 color: #fff;
722 }
723 body.admin a.label-info:hover, a.label-info:hover, a.badge-info:hover {
724 background: var(--vbo-blue-color) !important;
725 }
726 body.admin .label-success, .label-success, .badge-success {
727 background-color: var(--vbo-success-bg) !important;
728 }
729 body.admin .label-danger, .label-danger, .badge-danger, body.admin .label-error, .label-error, .badge-error {
730 background-color: var(--vbo-error-bg) !important;
731 }
732 body.admin .label-warning, .label-warning, .badge-warning {
733 background-color: var(--vbo-warning-bg) !important;
734 }
735 .js-editor-tinymce .mce-panel {
736 background-color: var(--vbo-config-child-bg-color);
737 }
738 .js-editor-tinymce .mce-container, .mce-container *, .mce-widget, .mce-widget *, .mce-reset {
739 color: var(--vbo-config-title-color) !important;
740 }
741 .js-editor-tinymce .mce-menubar .mce-menubtn button, .mce-menubar .mce-menubtn button span {
742 color: var(--vbo-config-title-color) !important;
743 }
744 .js-editor-tinymce .mce-menubar .mce-caret {
745 border-top-color: var(--vbo-config-title-color) !important;
746 }
747 .js-editor-tinymce .mce-btn {
748 background: var(--vbo-input-style-nested-deactive) !important;
749 border-color: var(--vbo-config-border-color) !important;
750 }
751 .js-editor-tinymce .mce-menubtn button {
752 color: var(--vbo-config-title-color) !important;
753 }
754 .js-editor-tinymce .mce-menubtn button:hover, .js-editor-tinymce .mce-container button:hover span, .js-editor-tinymce .mce-container button:hover i {
755 color: var(--vbo-base-color) !important;
756 }
757 .js-editor-tinymce .mce-container .mce-active button span, .js-editor-tinymce .mce-container .mce-active button i {
758 color: var(--vbo-base-color) !important;
759 }
760 .js-editor-tinymce .mce-menubar {
761 border-color: var(--vbo-config-border-color) !important;
762 }
763 .mce-container .mce-menu-item.mce-disabled:hover {
764 background: var(--vbo-basic-btn-hover) !important;
765 }
766 .js-editor-tinymce .mce-btn-group:not(:first-child) {
767 border-color: var(--vbo-config-border-color) !important;
768 }
769 .mce-container.mce-window {
770 background-color: var(--vbo-config-bg-color);
771 }
772 .mce-container.mce-window .mce-foot {
773 background-color: var(--vbo-config-bg-color);
774 border-color: var(--vbo-config-border-color);
775 }
776 .mce-container.mce-window .mce-foot .mce-btn {
777 background: var(--vbo-basic-btn);
778 border-color: var(--vbo-config-border-color);
779 }
780 .mce-container.mce-window .mce-foot .mce-btn:hover {
781 background: var(--vbo-input-style-deactive);
782 border-color: var(--vbo-config-border-color);
783 }
784 .mce-container.mce-window .mce-abs-layout-item input, .mce-container.mce-window .mce-abs-layout-item .mce-btn {
785 background-color: var(--vbo-input-style);
786 border-color: var(--vbo-config-border-color);
787 }
788 .mce-container.mce-window .mce-abs-layout-item .mce-btn .mce-caret {
789 border-top: 4px solid var(--vbo-config-title-color);
790 }
791 .mce-container.mce-window .mce-window-head {
792 border-color: var(--vbo-config-border-color);
793 }
794 .mce-window-body .mce-panel {
795 background-color: var(--vbo-input-style-deactive);
796 }
797 .mce-window-body .mce-panel .mce-tabs, .mce-window-body .mce-panel .mce-tabs + .mce-container-body {
798 background-color: var(--vbo-config-bg-color);
799 border-bottom: 1px solid var(--vbo-config-border-color);
800 }
801 .mce-window-body .mce-panel .mce-tab {
802 background-color: var(--vbo-config-bg-color);
803 border-color: var(--vbo-config-border-color);
804 }
805 .mce-window-body .mce-label, .mce-window-body .mce-panel .mce-tab {
806 text-shadow: none;
807 }
808 .mce-window-body .mce-abs-layout-item i.mce-i-checkbox {
809 background-color: var(--vbo-input-style);
810 border-color: var(--vbo-config-border-color);
811 }
812 .mce-window-body .mce-charmap td:hover {
813 background-color: var(--vbo-basic-btn);
814 }
815 .mce-tinymce-inline.mce-panel {
816 background: var(--vbo-middle-color-btn);
817 }
818 .mce-tinymce-inline.mce-panel .mce-btn {
819 background-color: var(--vbo-input-style);
820 border-color: var(--vbo-config-border-color);
821 }
822 .mce-tinymce-inline.mce-arrow.mce-arrow-down:after {
823 border-top-color: var(--vbo-middle-color-btn);
824 }
825 .mce-container-body .mce-splitbtn .mce-open.mce-active {
826 background-color: var(--vbo-input-style-deactive);
827 outline: 1px solid var(--vbo-config-border-color);
828 }
829 .mce-container.mce-floatpanel.mce-popover {
830 background-color: var(--vbo-config-bg-color);
831 }
832 .mce-container.mce-floatpanel.mce-popover .mce-grid td.mce-grid-cell div {
833 border-color: var(--vbo-config-border-color);
834 }
835 .mce-container.mce-floatpanel.mce-popover .mce-btn-flat:hover, .mce-container.mce-floatpanel.mce-popover .mce-btn-flat.mce-active, .mce-btn-flat:focus, .mce-container.mce-floatpanel.mce-popover .mce-btn-flat:active {
836 background-color: var(--vbo-basic-btn);
837 }
838 .mce-floatpanel.mce-popover.mce-bottom.mce-popover > .mce-arrow::after {
839 border-bottom-color: var(--vbo-config-bg-color);
840 }
841 .mce-notification *, .mce-notification .mce-progress .mce-text {
842 color: #333333 !important;
843 }
844 .js-calendar .table th, .js-calendar .table td {
845 border-color: var(--vbo-config-border-color);
846 }
847 .modal .modal-header {
848 border-bottom: 1px solid var(--vbo-light-color-btn);
849 }
850 .modal .modal-header .box-close {
851 border-left: 1px solid var(--vbo-light-color-btn);
852 }
853 .pagination.pagination-toolbar ul {
854 border: 1px solid var(--vbo-basic-btn);
855 }
856 #status.navbar-fixed-bottom .btn-toolbar a {
857 color: var(--vbo-config-titles-color-light);
858 }
859 #status.navbar-fixed-bottom .btn-toolbar a:hover {
860 color: var(--vbo-base-color);
861 }
862
863 /* Main Menu */
864 .vbo-submenu-wrap li > div .vbo-submenu-item-helper-link .vbo-submenu-item-helper-avatar img {
865 border: 1px solid var(--vbo-body-bg-color);
866 }
867
868 /* Dropdown Context Menu */
869 .vik-context-menu.vbo-dropdown-cxmenu {
870 background: var(--vbo-main-bg-color);
871 }
872
873 /* Joomla4 */
874 body.admin.layout-default #jmodal-vbo-notification-details button.btn-close {
875 position: relative;
876 background: var(--vbo-config-bg-color);
877 }
878 body.admin.layout-default #jmodal-vbo-notification-details button.btn-close:after {
879 font-family: "Font Awesome 5 Free", FontAwesomes !important;
880 content: "\f00d";
881 font-weight: 900;
882 color: #fff;
883 position: absolute;
884 top: 50%;
885 left: 50%;
886 transform: translate(-50%, -50%);
887 }
888 body.admin.layout-default label {
889 color: var(--vbo-body-text-color);
890 }
891 body.admin.layout-default .h1, body.admin.layout-default .h2, body.admin.layout-default .h3, body.admin.layout-default .h4, body.admin.layout-default .h5, body.admin.layout-default .h6, body.admin.layout-default h1, body.admin.layout-default h2, body.admin.layout-default h3, body.admin.layout-default h4, body.admin.layout-default h5, body.admin.layout-default h6 {
892 color: var(--vbo-config-title-color);
893 }
894 body.admin.layout-default joomla-field-media .field-media-preview {
895 background: var(--vbo-input-style);
896 }
897 body.admin.layout-default .popover-header {
898 background-color: var(--vbo-config-child-bg-color) !important;
899 border-bottom: 1px solid var(--vbo-config-child-bg-color) !important;
900 }
901 body.admin.layout-default .bs-popover-auto[data-popper-placement^="top"] > .popover-arrow::after, body.admin.layout-default .bs-popover-top > .popover-arrow::after {
902 border-top-color: var(--vbo-light-color-btn) !important;
903 }
904 body.admin.layout-default .bs-popover-auto[data-popper-placement^="right"] > .popover-arrow::after, body.admin.layout-default .bs-popover-end > .popover-arrow::after {
905 border-right-color: var(--vbo-light-color-btn) !important;
906 }
907 body.admin.layout-default .bs-popover-auto[data-popper-placement^="left"] > .popover-arrow::after {
908 border-left-color: var(--vbo-light-color-btn) !important;
909 }
910 body.admin.layout-default .subhead #toolbar joomla-toolbar-button .btn {
911 background: var(--vbo-input-style);
912 color: inherit;
913 border-color: var(--vbo-config-border-color);
914 }
915 body.admin.layout-default .subhead #toolbar joomla-toolbar-button .btn .fa-ellipsis-h {
916 color: var(--vbo-config-title-color);
917 }
918 .vbo-admin-container .vbo-param-container .vbo-param-setting select, .new_depovr_container select, .vbo-calendar-custmail-tpls-wrap select, .vbo-bookingdet-topcontainer select, .vbo-roomdet-guest-detail select, .vbo-btn-toolbar select, .occupancy-adults-ovr select, .vbo-reportwidget-filters select, form select:not([multiple]) {
919 background: var(--vbo-input-style) url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20width%3D%2220%22%20height%3D%2220%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M5%206l5%205%205-5%202%201-7%207-7-7%202-1z%22%20fill%3D%22%23474c5b%22%2F%3E%3C%2Fsvg%3E') no-repeat right 5px top 55% !important;
920 border-color: var(--vbo-config-border-color) !important;
921 }
922 .vbo-reportwidget-filters {
923 box-shadow: 0 4px 14px rgba(0,0,0,.6);
924 }
925 .vbo-widget-booskcal-wrap .vbo-widget-booskcal-calendar-table td[data-cta="1"][data-ctd="1"] {
926 background: repeating-linear-gradient( -45deg, var(--vbo-body-bg-color), var(--vbo-body-bg-color) 10px, var(--vbo-toolbar-bg-color) 10px, var(--vbo-toolbar-bg-color) 20px );
927 }
928 .vbo-widget-booskcal-wrap .vbo-widget-booskcal-calendar-table td[data-cta="1"][data-ctd="1"]:hover {
929 background: var(--vbo-main-bg-color);
930 }
931 .vbo-widget-booskcal-cell-mday.busy.vbo-partially .vbo-widget-booskcal-mday-roomrate span {
932 color: var(--vbo-orange-color);
933 }
934 .js-editor-tinymce .tox-tinymce {
935 border-color: var(--vbo-config-border-color);
936 }
937 .js-editor-tinymce .tox .tox-menubar {
938 border-bottom: 1px solid var(--vbo-config-border-color);
939 background: var(--vbo-middle-color-btn);
940 color: var(--vbo-container-text-color);
941 }
942 .js-editor-tinymce .tox .tox-mbtn > span, .js-editor-tinymce .tox .tox-tbtn > span {
943 color: var(--vbo-body-text-color);
944 }
945 .js-editor-tinymce .tox .tox-mbtn:hover:not(:disabled):not(.tox-mbtn--active), .js-editor-tinymce .tox .tox-tbtn:hover {
946 background: var(--vbo-input-style-nested-deactive);
947 border-color: var(--vbo-input-style-nested-deactive);
948 }
949 .js-editor-tinymce .tox .tox-mbtn--active, .js-editor-tinymce .tox .tox-mbtn:focus, .js-editor-tinymce .tox .tox-mbtn:focus:not(:disabled), .js-editor-tinymce .tox .tox-tbtn:focus, .js-editor-tinymce .tox .tox-tbtn--enabled, .js-editor-tinymce .tox .tox-tbtn--enabled:hover {
950 background: var(--vbo-input-style-nested-deactive);
951 border-color: var(--vbo-input-style-nested-deactive);
952 }
953 .tox.tox-tinymce-aux .tox-menu {
954 border-color: var(--vbo-config-border-color) !important;
955 background: var(--vbo-input-style);
956 }
957 .tox.tox-tinymce-aux .tox-collection__item, .tox.tox-tinymce-aux .tox-collection__item-accessory {
958 color: var(--vbo-body-text-color);
959 }
960 .tox.tox-tinymce-aux .tox-collection__item--state-disabled, .tox.tox-tinymce-aux .tox-collection__item--state-disabled .tox-collection__item-accessory {
961 color: var(--vbo-config-title-color);
962 }
963 .tox.tox-tinymce-aux .tox-collection--list .tox-collection__group {
964 border-top: 1px solid var(--vbo-config-border-color) !important;
965 }
966 .tox.tox-tinymce-aux .tox-collection--list .tox-collection__item--active, .tox.tox-tinymce-aux .tox-collection--list .tox-collection__item--enabled, .js-editor-tinymce .tox .tox-tbtn:active {
967 background: var(--vbo-input-style-nested-deactive);
968 }
969 .tox.tox-tinymce-aux .tox-collection--list .tox-collection__item--active:not(.tox-collection__item--state-disabled) {
970 color: var(--vbo-config-title-covlor);
971 }
972 .tox.tox-tinymce-aux .tox-collection--list .tox-collection__item--enabled {
973 color: var(--vbo-config-title-color);
974 }
975 .tox.tox-tinymce-aux :not(svg):not(rect) {
976 color: var(--vbo-config-title-color) !important;
977 }
978 .tox.tox-tinymce-aux .tox-collection__item-caret svg, .js-editor-tinymce .tox .tox-toolbar-overlord svg, .js-editor-tinymce .tox-tbtn:hover svg {
979 fill: var(--vbo-config-title-color) !important;
980 }
981 .tox.tox-tinymce-aux .tox-dialog {
982 border-color: var(--vbo-config-border-color);
983 background-color: var(--vbo-config-bg-color);
984 }
985 .tox.tox-tinymce-aux .tox-dialog__footer, .tox.tox-tinymce-aux .tox-dialog__header {
986 background-color: var(--vbo-config-bg-color);
987 }
988 .tox.tox-tinymce-aux .tox-dialog__footer {
989 border-color: var(--vbo-config-border-color);
990 }
991 .tox.tox-tinymce-aux .tox-tbtn svg {
992 fill: var(--vbo-base-color);
993 }
994 .tox.tox-tinymce-aux .tox-dialog__footer .tox-tbtn--select {
995 border: 1px solid var(--vbo-config-border-color);
996 }
997 .tox.tox-tinymce-aux .tox-button--secondary[disabled], .tox.tox-tinymce-aux .tox-button--naked[disabled] {
998 background-color: var(--vbo-input-style-deactive);
999 border: 1px solid var(--vbo-config-border-color);
1000 }
1001 .tox.tox-tinymce-aux .tox-button--secondary:hover:not(:disabled) {
1002 background-color: var(--vbo-input-style-nested-deactive);
1003 border: 1px solid var(--vbo-config-border-color);
1004 }
1005 .tox.tox-tinymce-aux .tox-dialog__footer .tox-button {
1006 color: #fff !important;
1007 }
1008 .js-editor-tinymce .tox-editor-header .tox-toolbar, .js-editor-tinymce .tox-editor-header .tox-toolbar__overflow, .js-editor-tinymce .tox-editor-header .tox-toolbar__primary {
1009 background-color: var(--vbo-config-bg-color);
1010 }
1011 .js-editor-tinymce .tox:not([dir="rtl"]) .tox-toolbar__group:not(:last-of-type), .js-editor-tinymce .tox .tox-menubar + .tox-toolbar, .js-editor-tinymce .tox .tox-menubar + .tox-toolbar-overlord .tox-toolbar__primary {
1012 border-color: var(--vbo-config-border-color) !important;
1013 }
1014 .js-editor-tinymce .tox:not([dir="rtl"]) .tox-toolbar__group:not(:last-of-type) {
1015 border-right: 1px solid var(--vbo-config-border-color) !important;
1016 }
1017 .js-editor-tinymce .tox-split-button {
1018 border: 1px solid var(--vbo-config-bg-color) !important;
1019 }
1020 .js-editor-tinymce .tox-split-button:hover {
1021 box-shadow: none !important;
1022 border: 1px solid var(--vbo-config-border-color) !important;
1023 background: var(--vbo-input-style-nested-deactive);
1024 }
1025 .tox .tox-dialog .tox-button--secondary {
1026 background-color: var(--vbo-input-style-deactive);
1027 border: 1px solid var(--vbo-config-border-color);
1028 }
1029 .tox .tox-dialog .tox-button--secondary:hover {
1030 background-color: var(--vbo-input-style-nested-deactive);
1031 }
1032 .tox.tox-tinymce-aux .tox-button--naked:hover:not(:disabled) {
1033 background-color: var(--vbo-input-style-deactive);
1034 border: 1px solid var(--vbo-config-border-color);
1035 }
1036 .tox.tox-tinymce-aux .tox-collection--toolbar .tox-collection__item--active {
1037 background-color: var(--vbo-input-style-deactive);
1038 }
1039 .tox.tox-tinymce-aux .tox-listboxfield .tox-listbox--select, .tox.tox-tinymce-aux .tox-textarea, .tox .tox-textfield, .tox .tox-toolbar-textfield {
1040 background-color: var(--vbo-input-style) !important;
1041 border-color: var(--vbo-config-border-color) !important;
1042 }
1043 .tox.tox-tinymce-aux .tox-listbox__select-chevron svg {
1044 fill: var(--vbo-config-title-color);
1045 }
1046 .tox.tox-tinymce-aux .tox-pop__dialog {
1047 background-color: var(--vbo-config-bg-color);
1048 border-color: var(--vbo-config-border-color);
1049 }
1050 .tox.tox-tinymce-aux .tox-pop__dialog .tox-tbtn svg {
1051 fill: var(--vbo-config-title-color);
1052 }
1053 .tox.tox-tinymce-aux .tox-pop__dialog .tox-tbtn span {
1054 color: var(--vbo-config-title-color);
1055 }
1056 .tox.tox-tinymce-aux .tox-pop__dialog .tox-tbtn--enabled, .tox.tox-tinymce-aux .tox-pop__dialog .tox-tbtn--enabled:hover {
1057 background-color: var(--vbo-input-style-nested-deactive);
1058 }
1059 .tox.tox-tinymce-aux .tox-pop__dialog .tox-tbtn:hover {
1060 background-color: var(--vbo-input-style-nested-deactive);
1061 }
1062 .tox.tox-tinymce-aux .tox-pop__dialog .tox-tbtn:hover span, .tox.tox-tinymce-aux .tox-pop__dialog .tox-tbtn--enabled span {
1063 color: var(--vbo-base-color);
1064 }
1065 .tox.tox-tinymce-aux .tox-pop__dialog .tox-tbtn:hover svg, .tox.tox-tinymce-aux .tox-pop__dialog .tox-tbtn--enabled svg {
1066 fill: var(--vbo-base-color);
1067 }
1068 .tox.tox-tinymce-aux .tox-pop.tox-pop--top::before {
1069 border-color: transparent transparent var(--vbo-config-bg-color) transparent;
1070 }
1071 .tox.tox-tinymce-aux .tox-pop.tox-pop--top::after {
1072 border-color: transparent transparent var(--vbo-config-bg-color) transparent;
1073 }
1074 .tox.tox-tinymce-aux .tox-dialog__table tbody tr {
1075 border-color: var(--vbo-config-border-color);
1076 }
1077 .tox.tox-tinymce-aux .tox-notification--error p {
1078 color: #333 !important;
1079 }
1080 .tox.tox-tinymce-aux .tox-swatches__picker-btn svg {
1081 fill: var(--vbo-config-title-color);
1082 }
1083 .js-editor-tinymce .tox .tox-statusbar {
1084 background-color: var(--vbo-config-bg-color);
1085 border-color: var(--vbo-config-border-color);
1086 }
1087 .js-editor-tinymce .tox-statusbar a, .js-editor-tinymce .tox-statusbar__path-item, .js-editor-tinymce .tox-statusbar__wordcount {
1088 color: var(--vbo-config-title-color) !important;
1089 }
1090 joomla-toolbar-button .dropdown-menu {
1091 border-color: var(--vbo-config-border-color);
1092 }
1093 #jmodal-rss-feed .modal-footer {
1094 background-color: var(--vbo-config-bg-color);
1095 border-top: 1px solid var(--vbo-config-border-color);
1096 box-shadow: none;
1097 }
1098 .vbo-info-overlay-loading-dnd {
1099 color: #fff;
1100 background: rgb(28, 28, 28);
1101 }
1102 .vbo-loading-dnd-response {
1103 background: rgba(58, 58, 58, 0.87);
1104 }
1105
1106 #contextual-help-back {
1107 background-color: var(--vbo-light-blue);
1108 border-color: var(--vbo-config-border-color);
1109 }
1110 .contextual-help-tabs .active a {
1111 background-color: var(--vbo-light-blue);
1112 border-color: var(--vbo-config-border-color);
1113 }
1114 #screen-meta-links .show-settings {
1115 border-color: var(--vbo-basic-btn-focus);
1116 }
1117
1118 /* Widgets customizations */
1119 .vbo-widget-notifscenter-wrap .vbo-widget-notifscenter-group span:not([data-badge-count=""])::after {
1120 background: var(--vbo-grey-blue-bg);
1121 }
1122 .vbo-widget-notifscenter-wrap .vbo-widget-notifscenter-group-active span:not([data-badge-count=""])::after, .vbo-widget-notifscenter-wrap .vbo-widget-notifscenter-group:hover span:not([data-badge-count=""])::after {
1123 background: var(--vbo-info-bg);
1124 }
1125 .vbo-widget-notifscenter-list .vbo-widget-notifscenter-notif-wrap .vbo-widget-notifscenter-notif-cta .vbo-notifscenter-cta-btn, .aitools-message-addon .btn.vbo-ai-assistant-addon-btn {
1126 background: var(--vbo-config-bg-dark);
1127 border: 1px solid #999;
1128 }
1129 .aitools-message-addon .btn.vbo-ai-assistant-addon-btn:focus {
1130 background: var(--vbo-config-bg-color);
1131 }
1132 .vbo-w-guestmessages-message-new .vbo-w-guestmessages-message-gtitle .message-new {
1133 color: #78afdd;
1134 }
1135
1136 /* AI channel */
1137 .aitools-message-addon .vbo-ai-source-badge-details {
1138 color: #fff;
1139 }
1140 }
1141