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-dark.css

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

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