PluginProbe
VikBooking Hotel Booking Engine & PMS / 1.7.2
VikBooking Hotel Booking Engine & PMS v1.7.2
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.2, at admin/resources/vbo-appearance-auto.css

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