PluginProbe
VikBooking Hotel Booking Engine & PMS / trunk
VikBooking Hotel Booking Engine & PMS vtrunk
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 1.7.3 All 36 releases
vikbooking / admin / resources / vbo-appearance-dark.css

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

1,399 lines 53.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 "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 --vbo-table-light-grey: #373737;
20
21 /* main bg and text color */
22 --vbo-container-text-color:rgba(255, 255, 255, 0.87);
23 --vbo-contrast-text-color: rgba(255, 255, 255, 0.87);
24 --vbo-base-color: #4e8abb; /* #6096c2 */
25 --vbo-base-color-hover: #2c6fa5;
26 --vbo-link-text-color: #92c4ee;
27 --vbo-basic-btn: #181b22;
28 --vbo-basic-btn-hover: #303942;
29 --vbo-basic-btn-focus: #444;
30 --vbo-light-color-btn: #303942;
31 --vbo-middle-color-btn: #262f39;
32 --vbo-grey-blue-bg: #424954;
33 --vbo-light-blue: #313f4d;
34 --vbo-white-blue-bg: #282e39;
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
59 --vbo-orange-color: #d09754;
60 --vbo-orange-color-hover: #be8340;
61
62 --vbo-green-color: #489e48;
63 --vbo-green-color-hover: #428242;
64 --vbo-green-color-focus: #65c265;
65
66 --vbo-light-green-color: #4e754c;
67 --vbo-light-green-color-hover: #365335;
68
69 --vbo-blue-color: #3984aa;
70 --vbo-blue-color-hover: #498fb3;
71
72 --vbo-gold-color: #ccc450;
73 --vbo-purple-color: #b746df;
74 --vbo-ai-color: #8b5fe8;
75
76 /* Notification Status */
77 --vbo-info-bg: #5488b0;
78 --vbo-info-txt: #d5d5d5;
79 --vbo-info-border: #4e7891;
80
81 --vbo-warning-bg: #ffe8bb;
82 --vbo-warning-bg-txt: #df7212;
83 --vbo-warning-border: #d99323;
84
85 --vbo-error-bg: #eab0b0;
86 --vbo-error-txt: #800;
87 --vbo-error-border: #ea6060;
88
89 /* Tag colors */
90 --vbo-tag-red-bg: #de555373;
91 --vbo-tag-red-txt: #d5d5d5;
92 --vbo-tag-red-border: #2e2423;
93
94 --vbo-tag-green-bg: #2d996480;
95 --vbo-tag-green-txt: #eee;
96 --vbo-tag-green-border: #182c18;
97
98 --vbo-tag-olive-bg: #A7C08B8A;
99 --vbo-tag-olive-txt: #E5EEDC;
100 --vbo-tag-olive-border: #2f3d1f;
101
102 --vbo-tag-blue-bg: #3372a980;
103 --vbo-tag-blue-txt: #c6cae1;
104 --vbo-tag-blue-border: #112a50;
105
106 --vbo-tag-ocean-bg: #29a4d081;
107 --vbo-tag-ocean-txt: #fff;
108 --vbo-tag-ocean-border: #1e414b;
109
110 --vbo-tag-brown-bg: #b8654373;
111 --vbo-tag-brown-txt: #ffeae3;
112 --vbo-tag-brown-border: #3a2d24;
113
114 --vbo-tag-yellow-bg: #fab14380;
115 --vbo-tag-yellow-txt: #f7e6c0;
116 --vbo-tag-yellow-border: #322d1c;
117
118 --vbo-tag-orange-bg: #e97e2373;
119 --vbo-tag-orange-txt: #ffe1c3;
120 --vbo-tag-orange-border: #341e0f;
121
122 --vbo-tag-purple-bg: #b572f570;
123 --vbo-tag-purple-txt: #e1e1e1;
124 --vbo-tag-purple-border: #3b2349;
125
126 --vbo-tag-pink-bg: #dc4c9166;
127 --vbo-tag-pink-txt: #f9f9f9;
128 --vbo-tag-pink-border: #361424;
129
130 --vbo-tag-black-bg: #a6a6a621;
131 --vbo-tag-black-txt: #bebebe;
132 --vbo-tag-black-border: #929292;
133
134 --vbo-tag-gray-bg: #fff3;
135 --vbo-tag-gray-txt: #ece6e6;
136 --vbo-tag-gray-border: #7e7e7e;
137
138 /* VCM Chat Message */
139 --vcm-chat-background: #0b1117;
140 --vcm-chat-bubble-host-background: #50575d;
141 --vcm-chat-bubble-host-color: #fff;
142 --vcm-chat-bubble-guest-background: #3c404c;
143 --vcm-chat-bubble-guest-color: #fff;
144 --vcm-chat-dot-flashing-on: #ddd;
145 --vcm-chat-dot-flashing-off: rgba(221, 221, 221, 0.2);
146 }
147 body {
148 background: var(--vbo-body-bg-color) !important;
149 color: var(--vbo-body-text-color) !important;
150 height: auto;
151 }
152 h2, h3 {
153 color: var(--vbo-config-text-color-light) !important;
154 }
155 .label, .badge {
156 background-color: #666;
157 }
158 table.table th {
159 background: var(--vbo-config-child-bg-color);
160 border-top: 1px solid var(--vbo-config-border-color);
161 border-bottom: 0;
162 }
163 table.table td {
164 background: var(--vbo-config-bg-color);
165 border-top: 1px solid var(--vbo-config-border-color);
166 border-bottom: 0;
167 }
168 .vbo-bookingslist-table thead, .vbo-list-table thead {
169 border-bottom: 0;
170 }
171 .vbo-bookingslist-table thead tr, .vbo-list-table thead tr {
172 border: 0;
173 }
174 .vbo-bookingslist-table.table > :not(:first-child), .vbo-list-table.table > :not(:first-child) {
175 border: 0;
176 }
177 .table tbody tr.warning > td, .table tr.no-results > td {
178 background-color: #5e5b4c !important;
179 }
180 .vbo-list-table tbody > tr > td, .vbo-list-table tbody > tr > th {
181 border-top: 1px solid var(--vbo-config-border-color) !important;
182 }
183 .btn.vbo-btn-black {
184 background: var(--vbo-config-bg-dark);
185 border: 1px solid #999;
186 }
187 .vbo-admin-dock-wrapper {
188 background: #30588bc4;
189 }
190
191 /* Config tabs */
192 .vbo-config-tabs-wrap dl.tabs {
193 border-bottom: 1px solid var(--vbo-light-color-btn);
194 }
195
196 /* Color action buttons */
197 .jtoolbar .page-title-action {
198 background: transparent;
199 color: var(--wp-btn-color);
200 border-color: var(--wp-btn-color);
201 }
202 .jtoolbar .page-title-action:hover {
203 background: transparent;
204 color: var(--wp-btn-color-hover);
205 border-color: var(--wp-btn-color-hover);
206 }
207 .fancybox-wrap .fancybox-skin {
208 background: var(--vbo-body-bg-color);
209 }
210 /* @WP style */
211 /* Plugin name */
212 .wrap h1.wp-heading-inline {
213 color: var(--vbo-body-text-color)
214 }
215 /* Arrow active WP menu on the left */
216 ul#adminmenu a.wp-has-current-submenu::after, ul#adminmenu > li.current > a.current::after {
217 border-right-color: var(--vbo-body-bg-color);
218 }
219 .wp-core-ui select {
220 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%;
221 color: inherit;
222 border-color: var(--vbo-config-border-color);
223 }
224 .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 {
225 background: var(--vbo-basic-btn) !important;
226 color: var(--vbo-config-title-color) !important;
227 border-color: var(--vbo-config-border-color);
228 }
229 .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] {
230 border: 1px solid var(--vbo-light-color-btn) !important;
231 background: var(--vbo-config-bg-color) !important;
232 border-color: var(--vbo-contrast-text-color);
233 }
234 .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 {
235 border-color: var(--wp-btn-color) !important;
236 color: var(--wp-btn-color) !important;
237 }
238 .wp-core-ui select.disabled, .wp-core-ui select:disabled {
239 background-color: var(--vbo-input-style-deactive);
240 color: var(--vbo-config-text-color-light);
241 }
242 .wp-core-ui select.disabled, .wp-core-ui select:disabled, input.disabled, input:disabled, select.disabled, select:disabled, textarea.disabled, textarea:disabled {
243 background: var(--vbo-config-bg-color);
244 border-color: var(--vbo-config-border-color);
245 }
246 .wp-editor-wrap .wp-editor-container, .wp-editor-wrap .quicktags-toolbar {
247 border-color: var(--vbo-config-border-color);
248 }
249 .wp-editor-wrap .quicktags-toolbar {
250 background: var(--vbo-middle-color-btn);
251 }
252 .mce-tinymce div.mce-panel {
253 background: var(--vbo-input-style);
254 }
255 .mce-tinymce div.mce-toolbar-grp {
256 border-bottom: 1px solid var(--vbo-config-border-color);
257 background: var(--vbo-middle-color-btn);
258 }
259 .wp-editor-wrap .wp-editor-tabs .wp-switch-editor {
260 background: var(--vbo-input-style);
261 border-color: var(--vbo-config-border-color);
262 color: inherit;
263 }
264 .wp-editor-wrap.html-active .switch-html, .wp-editor-wrap.tmce-active .switch-tmce {
265 background: var(--vbo-middle-color-btn);
266 border-color: var(--vbo-config-border-color);
267 border-bottom-color: var(--vbo-middle-color-btn);
268 color: inherit;
269 }
270 .mce-tinymce .mce-btn button, .mce-tinymce .mce-toolbar .mce-ico {
271 color: var(--vbo-config-title-color);
272 }
273 .mce-tinymce .mce-toolbar .mce-btn-group .mce-btn.mce-listbox {
274 background: var(--vbo-input-style-nested-deactive);
275 border-color: var(--vbo-config-border-color);
276 color: inherit;
277 }
278 .mce-tinymce .mce-toolbar .mce-btn-group .mce-btn.mce-listbox:hover, .mce-tinymce .mce-toolbar .mce-btn-group .mce-btn.mce-listbox:focus {
279 background: var(--vbo-input-style);
280 border-color: var(--vbo-config-border-color);
281 color: inherit;
282 }
283 .mce-tinymce .mce-panel .mce-btn i.mce-caret {
284 border-top-color: inherit;
285 }
286 .mce-tinymce .mce-panel .mce-btn:focus i.mce-caret, .mce-tinymce .mce-panel .mce-btn:hover i.mce-caret {
287 border-top-color: var(--vbo-contrast-text-color);
288 }
289 .mce-tinymce .mce-panel .mce-active i.mce-caret {
290 border-bottom-color: var(--vbo-contrast-text-color);
291 }
292 .mce-panel.mce-menu {
293 border-color: var(--vbo-config-border-color) !important;
294 background: var(--vbo-input-style);
295 }
296 .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 {
297 background: var(--vbo-base-color);
298 }
299 .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 {
300 background: var(--vbo-input-style);
301 border-color: var(--vbo-input-style);
302 color: var(--vbo-base-color);
303 box-shadow: none;
304 }
305 .mce-tinymce .mce-toolbar .mce-btn-group .mce-btn.mce-active, .mce-tinymce .mce-toolbar .mce-btn-group .mce-btn:active, .qt-dfw.active {
306 background: var(--vbo-input-style);
307 border-color: var(--vbo-config-border-color);
308 color: var(--vbo-base-color);
309 }
310 .vik-contentbuilder-editor-container .ql-editor h1 {
311 color: inherit;
312 font-weight: bold;
313 }
314 .vik-contentbuilder-editor-container .vbo-editor-hl-specialtag {
315 background-color: rgba(59, 193, 255, 0.3);
316 }
317 /* @WP End */
318 .popover, .popover-title {
319 color: var(--vbo-body-text-color);
320 }
321 .popover.right .arrow::after {
322 border-right-color: var(--vbo-light-color-btn) !important;
323 }
324 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 {
325 background-color: var(--vbo-input-style) !important;
326 border-color: var(--vbo-config-border-color) !important;
327 color: var(--vbo-container-text-color) !important;
328 }
329 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 {
330 background: var(--vbo-config-child-bg-color);
331 border-color: var(--vbo-base-color) !important;
332 }
333 .comment-ays, .feature-filter, .imgedit-group, .popular-tags, .stuffbox, .widgets-holder-wrap, .wp-editor-container, p.popular-tags, table.widefat {
334 background: var(--vbo-config-bg-color);
335 }
336 .widefat tfoot tr td, .widefat tfoot tr th, .widefat thead tr td, .widefat thead tr th {
337 color: var(--vbo-config-text-color-light);
338 }
339 .widefat td, .widefat th {
340 color: inherit;
341 }
342 /*.select2-container--default .select2-selection--multiple {
343 background-color: var(--vbo-input-style) !important;
344 }*/
345 .select2-container .select2-choice {
346 background: var(--vbo-input-style) !important;
347 border: 1px solid var(--vbo-config-border-color) !important;
348 color: var(--vbo-body-text-color) !important;
349 }
350 .select2-container .select2-choice .select2-arrow {
351 background-image: none !important;
352 background: #272c37 !important;
353 border-left: 1px solid #333 !important;
354 }
355 .notice, div.error, div.updated {
356 background: var(--vbo-config-bg-color) !important;
357 border-top: 1px solid var(--vbo-light-color-btn) !important;
358 border-right: 1px solid var(--vbo-light-color-btn) !important;
359 border-bottom: 1px solid var(--vbo-light-color-btn) !important;
360
361 p, .notice-dismiss:before {
362 color: #fff;
363 }
364 }
365 .select2-container.select2-container--default .select2-selection--single .select2-selection__rendered {
366 color: var(--vbo-config-titles-color-light);
367 }
368 body a {
369 color: var(--vbo-link-text-color);
370 }
371 body a:hover {
372 color: var(--vbo-base-color-hover);
373 }
374 body code, body pre {
375 background: var(--vbo-config-bg-color);
376 color: inherit;
377 }
378 /* Error Messages */
379 .warn {
380 border: 1px solid rgba(249, 233, 169, 0.5) !important;
381 background-color: rgba(249, 233, 169, 0.2) !important;
382 }
383 .info {
384 border: 1px solid rgba(142, 227, 255, 0.6) !important;
385 background-color: rgba(223, 247, 255, 0.3) !important;
386 }
387 .err {
388 border: 1px solid rgb(216, 0, 12, .3) !important;
389 background-color: rgba(255, 216, 216, 0.2) !important;
390 }
391
392
393 .bluedays {
394 background: var(--vbo-light-color-btn) !important;
395 }
396 .bluedays.vbo-tablewday-wend {
397 background: var(--vbo-middle-color-btn) !important;
398 }
399 .bluedays.vbo-overv-cell-newmonth {
400 background-color: #202c57 !important;
401 }
402 .vbo-roverview-table .vboverviewtablerow-subunit-unassigned td:first-child, .vbo-roverview-table .vboverviewtablerow-subunit-unassigned td.vbo-overv-avcell {
403 color: #222;
404 }
405 .vbo-room-reassignment-head .vbo-room-reassignment-move-to {
406 color: #1e2648;
407 background: var(--vbo-tag-ocean-txt);
408 }
409 .block-picked-start, .block-picked-middle, .block-picked-end {
410 background: rgba(255, 196, 153, 0.5);
411 }
412 .ui-widget-content a {
413 color: inherit;
414 }
415
416 .popover {
417 background: var(--vbo-light-color-btn) !important;
418 }
419 .popover.right > .bs-arrow::after {
420 border-right-color: var(--vbo-light-color-btn) !important;
421 }
422 .popover.left > .bs-arrow::after {
423 border-left-color: var(--vbo-light-color-btn) !important;
424 }
425 .popover.bottom > .bs-arrow::after {
426 border-bottom-color: var(--vbo-light-color-btn) !important;
427 }
428 .popover.top > .bs-arrow::after {
429 border-top-color: var(--vbo-light-color-btn) !important;
430 }
431 .popover-title {
432 background-color: var(--vbo-config-child-bg-color) !important;
433 border-bottom: 1px solid var(--vbo-config-child-bg-color) !important;
434 }
435 code, kbd {
436 background: var(--vbo-config-bg-color);
437 }
438
439 /* vbo */
440 .vbo-admin-widget-sticky-notes-wrap .vbo-admin-widget-sticky-notes-list > li {
441 background: #a9d4ee;
442 }
443 .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 {
444 background: #c4dbea;
445 }
446 .vbo-admin-widget-sticky-notes-wrap .vbo-admin-widget-sticky-notes-list .vbo-sticky-note-add {
447 border: 2px solid #a9d4ee;
448 }
449 .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 {
450 background: #a9d4ee;
451 }
452 .vbo-admin-widget-sticky-notes-wrap .vbo-admin-widget-sticky-notes-list .vbo-sticky-note a {
453 color: #056dc3;
454 }
455 .vbo-skeleton-loading {
456 background: var(--vbo-basic-btn);
457 }
458 .vbo-skeleton-loading:after {
459 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));
460 }
461 .vbo-dashboard-chart-container {
462 box-shadow: 0 0 20px rgba(0,0,0,.2);
463 }
464 .vbo-admin-widgets-list-customize .vbo-admin-widgets-section, .vbo-widgets-welcome-demo .vbo-widgets-welcome-demo-section {
465 background: #55626f;
466 }
467 .vbo-admin-widgets-list-customize .vbo-admin-widgets-section .vbo-admin-widgets-container, .vbo-widgets-welcome-demo .vbo-widgets-welcome-demo-container {
468 background: #6a848e;
469 }
470 .vbo-admin-widgets-list-customize .vbo-admin-widgets-section .vbo-admin-widgets-container.vbo-admin-widgets-container-addnew:hover,
471 .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 {
472 background: #2c6880;
473 }
474 .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 {
475 color: var(--vbo-config-text-color-light);
476 }
477 .vbo-admin-widgets-list-customize .vbo-admin-widget-elem-cmds, .vbo-admin-widgets-list-customize .vbo-admin-widgets-widget-remove {
478 color: #eee;
479 }
480 .vbo-widgets-welcome-demo .vbo-widgets-welcome-demo-widget {
481 background: var(--vbo-config-bg-color);
482 }
483 .vbo-tinymce-modal {
484 background-color: var(--vbo-config-bg-color);
485 }
486 .vbo-tinymce-modal form h1 {
487 background: var(--vbo-config-child-bg-color);
488 border-color: var(--vbo-config-border-color);
489 color: inherit;
490 }
491 .vbo-tinymce-modal .shortcodes-group {
492 border-color: var(--vbo-config-border-color);
493 }
494 .vbo-tinymce-modal .shortcode-record {
495 background-color: var(--vbo-toolbar-bg-color);
496 border-color: var(--vbo-config-border-color);
497 }
498 .vbo-tinymce-modal .shortcode-record.selected {
499 background-color: var(--vbo-light-color-btn);
500 }
501 .vbo-tinymce-modal .vbo-tinymce-submitbox {
502 border-color: var(--vbo-config-border-color);
503 background: var(--vbo-config-child-bg-color);
504 }
505 .vbo-tinymce-modal .vbo-tinymce-submitbox #vbo-tinymce-cancel button {
506 background-color: var(--vbo-basic-btn) !important;
507 border-color: var(--vbo-config-border-color);
508 }
509 .vbo-tinymce-modal .vbo-tinymce-submitbox #vbo-tinymce-cancel button:hover {
510 background-color: var(--vbo-basic-btn-hover) !important;
511 }
512 .vbo-tinymce-modal .vbo-tinymce-submitbox #vbo-tinymce-update button {
513 background-color: var(--vbo-green-color) !important;
514 border-color: var(--vbo-green-color);
515 color: inherit inherit;
516 }
517 .vbo-tinymce-modal .vbo-tinymce-submitbox #vbo-tinymce-update button:hover {
518 background-color: var(--vbo-green-color-hover) !important;
519 }
520 .vbo-inspector-wrap {
521 background-color: rgba(255, 255, 255, 0.94);
522 }
523 .vbo-roverview-datecmd-top .vbo-roverview-datecmd-date {
524 background: var(--vbo-input-style);
525 border: 1px solid var(--vbo-config-border-color);
526 }
527 .vbo-roverviewrowone .vbo-roverv-festcell, .notbusy.vbo-overv-festcell, .subnotbusy.vbo-overv-festcell, .bluedays.vbo-overv-festcell, .vbo-tableaux-festcell {
528 background-color: #6f5a6b !important;
529 }
530 .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 {
531 background-color: #80667c !important;
532 }
533 .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,
534 .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 {
535 background-color: #513d4e !important;
536 }
537 .notbusy.vbo-overv-todaycell, .subnotbusy.vbo-overv-todaycell, .bluedays.vbo-overv-todaycell, .vbo-tableaux-table .vbo-tableaux-todaycell {
538 background-color: #6889ab !important;
539 }
540 .notbusy.vbo-overv-todaycell:hover, .subnotbusy.vbo-overv-todaycell:hover, .bluedays.vbo-overv-todaycell:hover, .vbo-tableaux-table .vbo-tableaux-todaycell:hover {
541 background-color: #5d8fc4 !important;
542 }
543 .vboverviewtablerow .vbo-partially, .vbo-overview-legend-yellow .vbo-overview-legend-box {
544 background: none repeat scroll 0 0 #c2770d !important;
545 }
546 .bluedays.vbo-roverw-tablewday-wend {
547 background: var(--vbo-middle-color-btn) !important;
548 }
549 .vbo-calcrates-rateblock {
550 background-color: var(--vbo-input-style);
551 }
552 .vbo-avcalendars-wrapper .vbo-calendar-cal-container .vbadmincaltable {
553 background-color: var(--vbo-light-color-btn);
554 }
555 .vbo-overview-tip-bookingcont-left {
556 background-color: rgba(60, 62, 67);
557 }
558 .vbo-overview-tip-bookingcont-right {
559 background-color: rgba(90, 90, 90);
560 }
561 .vbo-overview-tip-bookingcont .vbo-overview-tip-lbl {
562 color: rgb(190, 216, 235);
563 }
564 .vbo-overview-tip-bctag-subtip {
565 background-color: rgb(92, 92, 92);
566 }
567 .vbo-overview-tip-bctag-subtip:before {
568 border-color: transparent rgb(92, 92, 92) transparent transparent;
569 }
570 .vbo-bookingdet-command .btn.vbo-config-btn {
571 border: 1px solid #434650;
572 }
573 .vbo-dropfiles-target {
574 color: var(--vbo-config-text-color-light) !important;
575 background-color: var(--vbo-config-child-bg-color) !important;
576 border-color: var(--vbo-config-border-color);
577 }
578 .btn.vbo-condtext-specialtag-btn {
579 background-color: #181b1d;
580 border: 1px solid var(--vbo-config-border-color);
581 }
582 .viwpro-procnt .vikwppro-licencecnt {
583 background: #204255;
584 }
585 .viwpro-procnt .viwpro-procnt-inner {
586 border: 2px solid #54708e;
587 }
588 .vikwppro-licenceform:after {
589 border-color: transparent transparent transparent #204255;
590 }
591 .vbo-insertrates-cont > div {
592 background-color: var(--vbo-basic-btn-hover);
593 }
594 .vikpro-e4jc-badgeimg img {
595 background: #101010;
596 padding: 4px;
597 border-radius: 4px;
598 }
599 .viwpro-e4jc-channels .viwpro-e4jc-channels-inner {
600 background: #101010;
601 margin: 20px;
602 border-radius: 4px;
603 }
604 .vikwppro-download-progress progress[value]::-moz-progress-bar, .vikwppro-download-progress progress[value]::-webkit-progress-bar {
605 background: #265f8c;
606 }
607 .vbo-overview-tiploading {
608 background-color: rgba(58,58,58, .9);
609 }
610 .vbo-room-channels-mapped-wrap .vbo-room-channels-mapped-ch {
611 background: rgba(0,0,0,.4);
612 }
613 #progress.progress {
614 background: var(--vbo-config-child-bg-color);
615 background-image: none;
616 }
617 .vbo-custsearchres-entry-highligthed {
618 background: var(--vbo-config-child-bg-color);
619 }
620 .vbo-translations-lim-wrap table select {
621 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;
622 background-color: var(--vbo-input-style) !important;
623 background-size: 8px 10px;
624 }
625 .vbo-roverw-daymod-infospids-outcont {
626 background: var(--vbo-main-bg-color) none repeat scroll 0 0;
627 }
628 .vbo-ratesoverview-period-box-cals-inner {
629 background: var(--vbo-basic-btn);
630 }
631 .vbo-timeline-radio:checked + .vbo-timeline-relative .vbo-timeline-circle {
632 background: #fff;
633 }
634 /* VikBooking Chat */
635 .chat-border-layout .chat-threads-panel {
636 border-color: var(--vbo-basic-btn) !important;
637 }
638 .chat-threads-list li {
639 border-color: var(--vbo-config-border-color) !important;
640 background: var(--vbo-config-bg-color) !important;
641 }
642 .chat-threads-list li.active {
643 background-color: #3c404c !important;
644 border-color: var(--vbo-config-border-color) !important;
645 }
646 .chat-threads-list li:not(.active):hover {
647 background-color: #2e323d !important;
648 }
649 .chat-input-footer .textarea-input .chat-action-btn {
650 color: var(--vbo-config-title-color) !important;
651 }
652 .chat-input-footer .textarea-input .chat-action-btn:hover {
653 color: var(--vbo-base-color) !important;
654 }
655 .chat-conversation .chat-message .speech-bubble.received {
656 background: #3c404c !important;
657 border-color: #3c404c !important;
658 color: #fff !important;
659 }
660 .chat-conversation .chat-message .speech-bubble.sent {
661 background: #003f75 !important;
662 color: #fff !important;
663 border-color: #003f75 !important;
664 }
665 .chat-input-footer .chat-uploads-bar .chat-attachment {
666 background-color: var(--vbo-light-color-btn) !important;
667 border-color: var(--vbo-config-border-color) !important;
668 }
669 .chat-conversation .chat-message .speech-bubble.sent.ai-reply:before {
670 background: #000b15 !important;
671 border-color: #003f75 !important;
672 }
673 .chat-conversation .chat-message .speech-bubble.sent ~ .reactions {
674 background: #003f75 !important;
675 border: 1px solid #0964b3 !important;
676 }
677 .chat-conversation .chat-message .speech-bubble.received ~ .reactions {
678 background: #3c404c !important;
679 border: 1px solid #72757c !important;
680 }
681 .chat-conversation .chat-message .speech-bubble.sent:not(.is-attachment) a {
682 color: #fff;
683 }
684 .vbo-w-guestmessages-message-new,
685 .vbo-chat-interface .vbo-chat-threads .chat-thread[data-read="0"] {
686 background: #283d62 !important;
687 }
688 .chat-message .message-content.received .chat-user-type {
689 background: #3a3a3a;
690 border: 1px solid #222;
691 }
692 .chat-message .message-content.sent .chat-user-type {
693 background: #003561;
694 border: 1px solid #005297;
695 }
696 .chat-message .message-content.sent .reactions {
697 background: #003561;
698 border: 1px solid #005297;
699 }
700 .chat-message .message-content.received .reactions {
701 background: #3c404c;
702 border: 1px solid #666;
703 }
704 .chat-message .chat-user-reactions i {
705 background: #3c404c;
706 border: 1px solid #666;
707 }
708 .chat-message .chat-user-reactions i:hover {
709 color: #eee;
710 }
711 .chat-message .reaction-picker {
712 background: #272727;
713 }
714 .chat-message .reaction-picker button:hover {
715 background: #4c4c4c;
716 }
717 .chat-session-toast .query-summary-head {
718 background: #333a64;
719 }
720 .chat-session-toast .chat-session-toast-message-content {
721 background-color: #222930;
722 }
723 /* VikBooking Telephone */
724 .iti__country-list {
725 background: var(--vbo-config-bg-color);
726 border-color: var(--vbo-config-border-color);
727 }
728 .iti__country.iti__highlight {
729 background-color: var(--vbo-light-color-btn);
730 }
731 /* Content Builder */
732 .ql-toolbar.ql-snow + .ql-container.ql-snow, .vbo-tm-panel-editor {
733 background: var(--vbo-middle-color-btn) !important;
734 }
735
736 /* @Joomla */
737 body.admin #status {
738 background: var(--vbo-config-bg-color);
739 color: var(--vbo-config-title-color);
740 border-color: var(--vbo-config-border-color);
741 }
742 body .btn {
743 background: var(--vbo-basic-btn);
744 border: 1px solid var(--vbo-config-border-color);
745 color: var(--vbo-body-text-color);
746 }
747 body .btn:hover, body .btn:focus {
748 background-color: var(--vbo-basic-btn-hover);
749 border-color: var(--vbo-config-border-color);
750 color: var(--vbo-body-text-color);
751 }
752 body .btn-success {
753 background: var(--vbo-green-color);
754 border: 1px solid var(--vbo-green-color);
755 }
756 body .btn-success:hover {
757 background: var(--vbo-green-color-hover);
758 border: 1px solid var(--vbo-green-color-hover);
759 }
760 body .btn-success:focus, body .btn-success:active {
761 background: var(--vbo-green-color-focus);
762 border: 1px solid var(--vbo-green-color-focus);
763 }
764 body.admin #content .btn:hover, body.admin #content .btn:focus {
765 background: var(--vbo-basic-btn-hover);
766 border: 1px solid var(--vbo-config-bg-color);
767 color: var(--vbo-body-text-color);
768 }
769 body.admin .pagination ul > li > a, .pagination ul > li > span {
770 background: var(--vbo-basic-btn) !important;
771 color: var(--vbo-config-title-color) !important;
772 border-color: var(--vbo-config-border-color);
773 }
774 body.admin .pagination ul > li.disabled > a, body.admin .pagination ul > li.disabled > span {
775 border: 1px solid var(--vbo-light-color-btn) !important;
776 background: var(--vbo-config-bg-color) !important;
777 border-color: var(--vbo-contrast-text-color);
778 }
779 body.admin .pagination ul > li.active > span, body.admin .pagination ul > li > a:hover, .pagination ul > li > span:hover {
780 border-color: var(--vbo-config-border-color);
781 background: var(--vbo-config-border-color) !important;
782 }
783 body.admin .calendar-container {
784 background: var(--vbo-config-bg-color) !important;
785 }
786 body.admin .calendar-container table tbody td.day.wn {
787 background: var(--vbo-config-bg-color);
788 }
789 body.admin .calendar-container table tbody td.disabled {
790 background: var(--vbo-input-style-deactive);
791 }
792 body.admin .input-append .add-on, .input-prepend .add-on {
793 background: var(--vbo-basic-btn);
794 border-color: var(--vbo-config-border-color);
795 }
796 body.admin .subhead {
797 background: var(--vbo-config-bg-color);
798 border-color: var(--vbo-config-border-color);
799 color: inherit;
800 }
801 /*
802 body.admin #toolbar div:not(#toolbar-new, #toolbar-apply) [class^="icon-"], body.admin #toolbar div:not(#toolbar-new, #toolbar-apply) [class*=" icon-"] {
803 background: var(--vbo-basic-btn);
804 border-right: 1px solid var(--vbo-config-bg-color);
805 }
806 */
807 body.admin #toolbar div:not(#toolbar-new, #toolbar-apply) .btn:hover, body.admin #toolbar div:not(#toolbar-new, #toolbar-apply) .btn:focus {
808 background: var(--vbo-basic-btn-hover);
809 border: 1px solid var(--vbo-config-bg-color) !important;
810 }
811 body.admin #toolbar .btn-success {
812 background: var(--vbo-green-color);
813 }
814 body.admin #toolbar .btn-success:hover {
815 background: var(--vbo-green-color-hover);
816 }
817 body.admin #toolbar .btn-success:focus, body.admin #toolbar .btn-success:active {
818 background: var(--vbo-green-color-focus);
819 }
820 body.admin #toolbar .dropdown-toggle-split {
821 border-color: var(--vbo-config-border-color);
822 }
823 body.admin #toolbar .dropdown-toggle-split .icon-chevron-down {
824 background: transparent !important;
825 border: 0 !important;
826 color: #fff;
827 }
828 body.admin #toolbar .btn-group .dropdown-menu {
829 background: var(--vbo-config-bg-color);
830 border-color: var(--vbo-config-border-color);
831 }
832 body.admin #toolbar .btn-group .dropdown-menu:hover {
833 background: var(--vbo-basic-btn-hover);
834 border: 1px solid var(--vbo-config-bg-color);
835 }
836 body.admin #toolbar .btn-group .dropdown-menu .dropdown-item > span {
837 background: transparent !important;
838 border: 0 !important;
839 }
840 .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 {
841 color: var(--vbo-body-text-color);
842 }
843 body.admin .modal-header {
844 background: var(--vbo-body-bg-color);
845 border-bottom: 1px solid var(--vbo-config-bg-color) !important;
846 }
847 body.admin .modal-header .close {
848 color: #fff;
849 }
850 body.admin .label, .badge {
851 background-color: #666;
852 }
853 body.admin .label.label-info, .label.label-info, .badge.badge-info {
854 background: var(--vbo-info-bg) !important;
855 color: #fff;
856 }
857 body.admin .label-info:hover, .label-info:hover, .badge-info:hover {
858 color: #fff;
859 }
860 body.admin a.label-info:hover, a.label-info:hover, a.badge-info:hover {
861 background: var(--vbo-blue-color) !important;
862 }
863 body.admin .label-success, .label-success, .badge-success {
864 background-color: var(--vbo-success-bg) !important;
865 }
866 body.admin .label-danger, .label-danger, .badge-danger, body.admin .label-error, .label-error, .badge-error {
867 background-color: var(--vbo-error-bg) !important;
868 }
869 body.admin .label-warning, .label-warning, .badge-warning {
870 background-color: var(--vbo-warning-bg) !important;
871 }
872 .js-editor-tinymce .mce-panel {
873 background-color: var(--vbo-config-child-bg-color);
874 }
875 .js-editor-tinymce .mce-container, .mce-container *, .mce-widget, .mce-widget *, .mce-reset {
876 color: var(--vbo-config-title-color) !important;
877 }
878 .js-editor-tinymce .mce-menubar .mce-menubtn button, .mce-menubar .mce-menubtn button span {
879 color: var(--vbo-config-title-color) !important;
880 }
881 .js-editor-tinymce .mce-menubar .mce-caret {
882 border-top-color: var(--vbo-config-title-color) !important;
883 }
884 .js-editor-tinymce .mce-btn {
885 background: var(--vbo-input-style-nested-deactive) !important;
886 border-color: var(--vbo-config-border-color) !important;
887 }
888 .js-editor-tinymce .mce-menubtn button {
889 color: var(--vbo-config-title-color) !important;
890 }
891 .js-editor-tinymce .mce-menubtn button:hover, .js-editor-tinymce .mce-container button:hover span, .js-editor-tinymce .mce-container button:hover i {
892 color: var(--vbo-base-color) !important;
893 }
894 .js-editor-tinymce .mce-container .mce-active button span, .js-editor-tinymce .mce-container .mce-active button i {
895 color: var(--vbo-base-color) !important;
896 }
897 .js-editor-tinymce .mce-menubar {
898 border-color: var(--vbo-config-border-color) !important;
899 }
900 .mce-container .mce-menu-item.mce-disabled:hover {
901 background: var(--vbo-basic-btn-hover) !important;
902 }
903 .js-editor-tinymce .mce-btn-group:not(:first-child) {
904 border-color: var(--vbo-config-border-color) !important;
905 }
906 .mce-container.mce-window {
907 background-color: var(--vbo-config-bg-color);
908 }
909 .mce-container.mce-window .mce-foot {
910 background-color: var(--vbo-config-bg-color);
911 border-color: var(--vbo-config-border-color);
912 }
913 .mce-container.mce-window .mce-foot .mce-btn {
914 background: var(--vbo-basic-btn);
915 border-color: var(--vbo-config-border-color);
916 }
917 .mce-container.mce-window .mce-foot .mce-btn:hover {
918 background: var(--vbo-input-style-deactive);
919 border-color: var(--vbo-config-border-color);
920 }
921 .mce-container.mce-window .mce-abs-layout-item input, .mce-container.mce-window .mce-abs-layout-item .mce-btn {
922 background-color: var(--vbo-input-style);
923 border-color: var(--vbo-config-border-color);
924 }
925 .mce-container.mce-window .mce-abs-layout-item .mce-btn .mce-caret {
926 border-top: 4px solid var(--vbo-config-title-color);
927 }
928 .mce-container.mce-window .mce-window-head {
929 border-color: var(--vbo-config-border-color);
930 }
931 .mce-window-body .mce-panel {
932 background-color: var(--vbo-input-style-deactive);
933 }
934 .mce-window-body .mce-panel .mce-tabs, .mce-window-body .mce-panel .mce-tabs + .mce-container-body {
935 background-color: var(--vbo-config-bg-color);
936 border-bottom: 1px solid var(--vbo-config-border-color);
937 }
938 .mce-window-body .mce-panel .mce-tab {
939 background-color: var(--vbo-config-bg-color);
940 border-color: var(--vbo-config-border-color);
941 }
942 .mce-window-body .mce-label, .mce-window-body .mce-panel .mce-tab {
943 text-shadow: none;
944 }
945 .mce-window-body .mce-abs-layout-item i.mce-i-checkbox {
946 background-color: var(--vbo-input-style);
947 border-color: var(--vbo-config-border-color);
948 }
949 .mce-window-body .mce-charmap td:hover {
950 background-color: var(--vbo-basic-btn);
951 }
952 .mce-tinymce-inline.mce-panel {
953 background: var(--vbo-middle-color-btn);
954 }
955 .mce-tinymce-inline.mce-panel .mce-btn {
956 background-color: var(--vbo-input-style);
957 border-color: var(--vbo-config-border-color);
958 }
959 .mce-tinymce-inline.mce-arrow.mce-arrow-down:after {
960 border-top-color: var(--vbo-middle-color-btn);
961 }
962 .mce-container-body .mce-splitbtn .mce-open.mce-active {
963 background-color: var(--vbo-input-style-deactive);
964 outline: 1px solid var(--vbo-config-border-color);
965 }
966 .mce-container.mce-floatpanel.mce-popover {
967 background-color: var(--vbo-config-bg-color);
968 }
969 .mce-container.mce-floatpanel.mce-popover .mce-grid td.mce-grid-cell div {
970 border-color: var(--vbo-config-border-color);
971 }
972 .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 {
973 background-color: var(--vbo-basic-btn);
974 }
975 .mce-floatpanel.mce-popover.mce-bottom.mce-popover > .mce-arrow::after {
976 border-bottom-color: var(--vbo-config-bg-color);
977 }
978 .mce-notification *, .mce-notification .mce-progress .mce-text {
979 color: #333333 !important;
980 }
981 .js-calendar .table th, .js-calendar .table td {
982 border-color: var(--vbo-config-border-color);
983 }
984 .modal .modal-header {
985 border-bottom: 1px solid var(--vbo-light-color-btn);
986 }
987 .modal .modal-header .box-close {
988 border-left: 1px solid var(--vbo-light-color-btn);
989 }
990 .pagination.pagination-toolbar ul {
991 border: 1px solid var(--vbo-basic-btn);
992 }
993 #status.navbar-fixed-bottom .btn-toolbar a {
994 color: var(--vbo-config-titles-color-light);
995 }
996 #status.navbar-fixed-bottom .btn-toolbar a:hover {
997 color: var(--vbo-base-color);
998 }
999 .vbo-widget-booskcal-wrap .vbo-widget-booskcal-calendar-table td:not(.busy).past {
1000 background-color: #373737;
1001 color: #717171
1002 }
1003
1004 /* Main Menu */
1005 .vbo-submenu-wrap li > div .vbo-submenu-item-helper-link .vbo-submenu-item-helper-avatar img {
1006 border: 1px solid var(--vbo-body-bg-color);
1007 }
1008
1009 /* Dropdown Context Menu */
1010 .vik-context-menu.vbo-dropdown-cxmenu {
1011 background: var(--vbo-config-bg-color);
1012 }
1013
1014 /* Joomla4 */
1015 body.admin.layout-default #jmodal-vbo-notification-details button.btn-close {
1016 position: relative;
1017 background: var(--vbo-config-bg-color);
1018 }
1019 body.admin.layout-default #jmodal-vbo-notification-details button.btn-close:after {
1020 font-family: "Font Awesome 7 Free", FontAwesome !important;
1021 content: "\f00d";
1022 font-weight: 900;
1023 color: #fff;
1024 position: absolute;
1025 top: 50%;
1026 left: 50%;
1027 transform: translate(-50%, -50%);
1028 }
1029 body.admin.layout-default label {
1030 color: var(--vbo-body-text-color);
1031 }
1032 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 {
1033 color: var(--vbo-config-title-color);
1034 }
1035 body.admin.layout-default joomla-field-media .field-media-preview {
1036 background: var(--vbo-input-style);
1037 }
1038 body.admin.layout-default .popover-header {
1039 background-color: var(--vbo-config-child-bg-color) !important;
1040 border-bottom: 1px solid var(--vbo-config-child-bg-color) !important;
1041 }
1042 body.admin.layout-default .bs-popover-auto[data-popper-placement^="top"] > .popover-arrow::after, body.admin.layout-default .bs-popover-top > .popover-arrow::after {
1043 border-top-color: var(--vbo-light-color-btn) !important;
1044 }
1045 body.admin.layout-default .bs-popover-auto[data-popper-placement^="right"] > .popover-arrow::after, body.admin.layout-default .bs-popover-end > .popover-arrow::after {
1046 border-right-color: var(--vbo-light-color-btn) !important;
1047 }
1048 body.admin.layout-default .bs-popover-auto[data-popper-placement^="left"] > .popover-arrow::after {
1049 border-left-color: var(--vbo-light-color-btn) !important;
1050 }
1051 body.admin.layout-default .subhead #toolbar joomla-toolbar-button .btn {
1052 background: var(--vbo-input-style);
1053 color: inherit;
1054 border-color: var(--vbo-config-border-color);
1055 }
1056 body.admin.layout-default .subhead #toolbar joomla-toolbar-button .btn .fa-ellipsis-h {
1057 color: var(--vbo-config-title-color);
1058 }
1059 .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]) {
1060 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;
1061 border-color: var(--vbo-config-border-color) !important;
1062 }
1063 .vbo-reportwidget-filters {
1064 box-shadow: 0 4px 14px rgba(0,0,0,.6);
1065 }
1066 .vbo-widget-booskcal-wrap .vbo-widget-booskcal-calendar-table td[data-cta="1"][data-ctd="1"] {
1067 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 );
1068 }
1069 .vbo-widget-booskcal-wrap .vbo-widget-booskcal-calendar-table td[data-cta="1"][data-ctd="1"]:hover {
1070 background: var(--vbo-main-bg-color);
1071 }
1072 .vbo-widget-booskcal-cell-mday.busy.vbo-partially .vbo-widget-booskcal-mday-roomrate span {
1073 color: var(--vbo-orange-color);
1074 }
1075 .js-editor-tinymce .tox-tinymce {
1076 border-color: var(--vbo-config-border-color);
1077 }
1078 .js-editor-tinymce .tox .tox-menubar {
1079 border-bottom: 1px solid var(--vbo-config-border-color);
1080 background: var(--vbo-middle-color-btn);
1081 color: var(--vbo-container-text-color);
1082 }
1083 .js-editor-tinymce .tox .tox-mbtn > span, .js-editor-tinymce .tox .tox-tbtn > span {
1084 color: var(--vbo-body-text-color);
1085 }
1086 .js-editor-tinymce .tox .tox-mbtn:hover:not(:disabled):not(.tox-mbtn--active), .js-editor-tinymce .tox .tox-tbtn:hover {
1087 background: var(--vbo-input-style-nested-deactive);
1088 border-color: var(--vbo-input-style-nested-deactive);
1089 }
1090 .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 {
1091 background: var(--vbo-input-style-nested-deactive);
1092 border-color: var(--vbo-input-style-nested-deactive);
1093 }
1094 .tox.tox-tinymce-aux .tox-menu {
1095 border-color: var(--vbo-config-border-color) !important;
1096 background: var(--vbo-input-style);
1097 }
1098 .tox.tox-tinymce-aux .tox-collection__item, .tox.tox-tinymce-aux .tox-collection__item-accessory {
1099 color: var(--vbo-body-text-color);
1100 }
1101 .tox.tox-tinymce-aux .tox-collection__item--state-disabled, .tox.tox-tinymce-aux .tox-collection__item--state-disabled .tox-collection__item-accessory {
1102 color: var(--vbo-config-title-color);
1103 }
1104 .tox.tox-tinymce-aux .tox-collection--list .tox-collection__group {
1105 border-top: 1px solid var(--vbo-config-border-color) !important;
1106 }
1107 .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 {
1108 background: var(--vbo-input-style-nested-deactive);
1109 }
1110 .tox.tox-tinymce-aux .tox-collection--list .tox-collection__item--active:not(.tox-collection__item--state-disabled) {
1111 color: var(--vbo-config-title-covlor);
1112 }
1113 .tox.tox-tinymce-aux .tox-collection--list .tox-collection__item--enabled {
1114 color: var(--vbo-config-title-color);
1115 }
1116 .tox.tox-tinymce-aux :not(svg):not(rect) {
1117 color: var(--vbo-config-title-color) !important;
1118 }
1119 .tox.tox-tinymce-aux .tox-collection__item-caret svg, .js-editor-tinymce .tox .tox-toolbar-overlord svg, .js-editor-tinymce .tox-tbtn:hover svg {
1120 fill: var(--vbo-config-title-color) !important;
1121 }
1122 .tox.tox-tinymce-aux .tox-dialog {
1123 border-color: var(--vbo-config-border-color);
1124 background-color: var(--vbo-config-bg-color);
1125 }
1126 .tox.tox-tinymce-aux .tox-dialog__footer, .tox.tox-tinymce-aux .tox-dialog__header {
1127 background-color: var(--vbo-config-bg-color);
1128 }
1129 .tox.tox-tinymce-aux .tox-dialog__footer {
1130 border-color: var(--vbo-config-border-color);
1131 }
1132 .tox.tox-tinymce-aux .tox-tbtn svg {
1133 fill: var(--vbo-base-color);
1134 }
1135 .tox.tox-tinymce-aux .tox-dialog__footer .tox-tbtn--select {
1136 border: 1px solid var(--vbo-config-border-color);
1137 }
1138 .tox.tox-tinymce-aux .tox-button--secondary[disabled], .tox.tox-tinymce-aux .tox-button--naked[disabled] {
1139 background-color: var(--vbo-input-style-deactive);
1140 border: 1px solid var(--vbo-config-border-color);
1141 }
1142 .tox.tox-tinymce-aux .tox-button--secondary:hover:not(:disabled) {
1143 background-color: var(--vbo-input-style-nested-deactive);
1144 border: 1px solid var(--vbo-config-border-color);
1145 }
1146 .tox.tox-tinymce-aux .tox-dialog__footer .tox-button {
1147 color: #fff !important;
1148 }
1149 .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 {
1150 background-color: var(--vbo-config-bg-color);
1151 }
1152 .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 {
1153 border-color: var(--vbo-config-border-color) !important;
1154 }
1155 .js-editor-tinymce .tox:not([dir="rtl"]) .tox-toolbar__group:not(:last-of-type) {
1156 border-right: 1px solid var(--vbo-config-border-color) !important;
1157 }
1158 .js-editor-tinymce .tox-split-button {
1159 border: 1px solid var(--vbo-config-bg-color) !important;
1160 }
1161 .js-editor-tinymce .tox-split-button:hover {
1162 box-shadow: none !important;
1163 border: 1px solid var(--vbo-config-border-color) !important;
1164 background: var(--vbo-input-style-nested-deactive);
1165 }
1166 .tox .tox-dialog .tox-button--secondary {
1167 background-color: var(--vbo-input-style-deactive);
1168 border: 1px solid var(--vbo-config-border-color);
1169 }
1170 .tox .tox-dialog .tox-button--secondary:hover {
1171 background-color: var(--vbo-input-style-nested-deactive);
1172 }
1173 .tox.tox-tinymce-aux .tox-button--naked:hover:not(:disabled) {
1174 background-color: var(--vbo-input-style-deactive);
1175 border: 1px solid var(--vbo-config-border-color);
1176 }
1177 .tox.tox-tinymce-aux .tox-collection--toolbar .tox-collection__item--active {
1178 background-color: var(--vbo-input-style-deactive);
1179 }
1180 .tox.tox-tinymce-aux .tox-listboxfield .tox-listbox--select, .tox.tox-tinymce-aux .tox-textarea, .tox .tox-textfield, .tox .tox-toolbar-textfield {
1181 background-color: var(--vbo-input-style) !important;
1182 border-color: var(--vbo-config-border-color) !important;
1183 }
1184 .tox.tox-tinymce-aux .tox-listbox__select-chevron svg {
1185 fill: var(--vbo-config-title-color);
1186 }
1187 .tox.tox-tinymce-aux .tox-pop__dialog {
1188 background-color: var(--vbo-config-bg-color);
1189 border-color: var(--vbo-config-border-color);
1190 }
1191 .tox.tox-tinymce-aux .tox-pop__dialog .tox-tbtn svg {
1192 fill: var(--vbo-config-title-color);
1193 }
1194 .tox.tox-tinymce-aux .tox-pop__dialog .tox-tbtn span {
1195 color: var(--vbo-config-title-color);
1196 }
1197 .tox.tox-tinymce-aux .tox-pop__dialog .tox-tbtn--enabled, .tox.tox-tinymce-aux .tox-pop__dialog .tox-tbtn--enabled:hover {
1198 background-color: var(--vbo-input-style-nested-deactive);
1199 }
1200 .tox.tox-tinymce-aux .tox-pop__dialog .tox-tbtn:hover {
1201 background-color: var(--vbo-input-style-nested-deactive);
1202 }
1203 .tox.tox-tinymce-aux .tox-pop__dialog .tox-tbtn:hover span, .tox.tox-tinymce-aux .tox-pop__dialog .tox-tbtn--enabled span {
1204 color: var(--vbo-base-color);
1205 }
1206 .tox.tox-tinymce-aux .tox-pop__dialog .tox-tbtn:hover svg, .tox.tox-tinymce-aux .tox-pop__dialog .tox-tbtn--enabled svg {
1207 fill: var(--vbo-base-color);
1208 }
1209 .tox.tox-tinymce-aux .tox-pop.tox-pop--top::before {
1210 border-color: transparent transparent var(--vbo-config-bg-color) transparent;
1211 }
1212 .tox.tox-tinymce-aux .tox-pop.tox-pop--top::after {
1213 border-color: transparent transparent var(--vbo-config-bg-color) transparent;
1214 }
1215 .tox.tox-tinymce-aux .tox-dialog__table tbody tr {
1216 border-color: var(--vbo-config-border-color);
1217 }
1218 .tox.tox-tinymce-aux .tox-notification--error p {
1219 color: #333 !important;
1220 }
1221 .tox.tox-tinymce-aux .tox-swatches__picker-btn svg {
1222 fill: var(--vbo-config-title-color);
1223 }
1224 .js-editor-tinymce .tox .tox-statusbar {
1225 background-color: var(--vbo-config-bg-color);
1226 border-color: var(--vbo-config-border-color);
1227 }
1228 .js-editor-tinymce .tox-statusbar a, .js-editor-tinymce .tox-statusbar__path-item, .js-editor-tinymce .tox-statusbar__wordcount {
1229 color: var(--vbo-config-title-color) !important;
1230 }
1231 joomla-toolbar-button .dropdown-menu {
1232 border-color: var(--vbo-config-border-color);
1233 }
1234 #jmodal-rss-feed .modal-footer {
1235 background-color: var(--vbo-config-bg-color);
1236 border-top: 1px solid var(--vbo-config-border-color);
1237 box-shadow: none;
1238 }
1239 .vbo-info-overlay-loading-dnd {
1240 color: #fff;
1241 background: rgb(28, 28, 28);
1242 }
1243 .vbo-loading-dnd-response {
1244 background: rgba(58, 58, 58, 0.87);
1245 }
1246
1247 #contextual-help-back {
1248 background-color: var(--vbo-light-blue);
1249 border-color: var(--vbo-config-border-color);
1250 }
1251 .contextual-help-tabs .active a {
1252 background-color: var(--vbo-light-blue);
1253 border-color: var(--vbo-config-border-color);
1254 }
1255 #screen-meta-links .show-settings {
1256 border-color: var(--vbo-basic-btn-focus);
1257 }
1258
1259 /* Widgets customizations */
1260 .vbo-widget-notifscenter-wrap .vbo-widget-notifscenter-group span:not([data-badge-count=""])::after {
1261 background: var(--vbo-grey-blue-bg);
1262 }
1263 .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 {
1264 background: var(--vbo-info-bg);
1265 }
1266 .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, .btn.vbo-content-genai {
1267 background: var(--vbo-config-bg-dark);
1268 border: 1px solid #999;
1269 }
1270 .aitools-message-addon .btn.vbo-ai-assistant-addon-btn:focus {
1271 background: var(--vbo-config-bg-color);
1272 }
1273 .vbo-w-guestmessages-message-new .vbo-w-guestmessages-message-gtitle .message-new {
1274 color: #78afdd;
1275 }
1276
1277 /* AI channel */
1278 .aitools-message-addon .vbo-ai-source-badge-details {
1279 color: #fff;
1280 }
1281 .aitools-messages-action-wrapper .aitools-uploaded-files .file-attachment {
1282 background: var(--vbo-grey-blue-bg);
1283 border-color: var(--vbo-config-bg-dark);
1284 }
1285
1286 /* Color Tags */
1287 .vbo-tagcolors-elems-wrap .red, .vbo-tm-color.red, .vbo-colortag-circle.red {
1288 background-color: var(--vbo-tag-red-bg);
1289 border-color: var(--vbo-tag-red-border);
1290 }
1291 .vbo-tagcolors-elems-wrap .green, .vbo-tm-color.green, .vbo-colortag-circle.green {
1292 background-color: var(--vbo-tag-green-bg);
1293 border-color: var(--vbo-tag-green-border);
1294 }
1295 .vbo-tagcolors-elems-wrap .olive, .vbo-tm-color.olive, .vbo-colortag-circle.olive {
1296 background-color: var(--vbo-tag-olive-bg);
1297 border-color: var(--vbo-tag-olive-border);
1298 }
1299 .vbo-tagcolors-elems-wrap .blue, .vbo-tm-color.blue, .vbo-colortag-circle.blue {
1300 background-color: var(--vbo-tag-blue-bg);
1301 border-color: var(--vbo-tag-blue-border);
1302 }
1303 .vbo-tagcolors-elems-wrap .ocean, .vbo-tm-color.ocean, .vbo-colortag-circle.ocean {
1304 background-color: var(--vbo-tag-ocean-bg);
1305 border-color: var(--vbo-tag-ocean-border);
1306 }
1307 .vbo-tagcolors-elems-wrap .brown, .vbo-tm-color.brown, .vbo-colortag-circle.brown {
1308 background-color: var(--vbo-tag-brown-bg);
1309 border-color: var(--vbo-tag-brown-border);
1310 }
1311 .vbo-tagcolors-elems-wrap .yellow, .vbo-tm-color.yellow, .vbo-colortag-circle.yellow {
1312 background-color: var(--vbo-tag-yellow-bg);
1313 border-color: var(--vbo-tag-yellow-border);
1314 }
1315 .vbo-tagcolors-elems-wrap .orange, .vbo-tm-color.orange, .vbo-colortag-circle.orange {
1316 background-color: var(--vbo-tag-orange-bg);
1317 border-color: var(--vbo-tag-orange-border);
1318 }
1319 .vbo-tagcolors-elems-wrap .purple, .vbo-tm-color.purple, .vbo-colortag-circle.purple {
1320 background-color: var(--vbo-tag-purple-bg);
1321 border-color: var(--vbo-tag-purple-border);
1322 }
1323 .vbo-tagcolors-elems-wrap .pink, .vbo-tm-color.pink, .vbo-colortag-circle.pink {
1324 background-color: var(--vbo-tag-pink-bg);
1325 border-color: var(--vbo-tag-pink-border);
1326 }
1327 .vbo-tagcolors-elems-wrap .black, .vbo-tm-color.black, .vbo-colortag-circle.black {
1328 background-color: var(--vbo-tag-black-bg);
1329 border-color: var(--vbo-tag-black-border);
1330 }
1331 .vbo-tagcolors-elems-wrap .gray, .vbo-tm-color.gray, .vbo-colortag-circle.gray {
1332 background-color: var(--vbo-tag-gray-bg);
1333 border-color: var(--vbo-tag-gray-border);
1334 }
1335
1336 /* Task Manager */
1337 .vbo-history-timeline .history-timeline-change {
1338 border-color: #3076b3;
1339 }
1340 .vbo-history-timeline .history-timeline-change .change-icon {
1341 background: #3076b3;
1342 }
1343 .vbo-history-timeline .history-timeline-change .change-details .change-events-list {
1344 background: #4f4f4f;
1345 }
1346
1347 /* MultiSwitcher double status */
1348 .vik-multiswitch-wrap.vbo-multiswitch-double .vik-multiswitch-radiobtn input:checked + .vik-multiswitch-trigger, .vik-multiswitch-wrap.vbo-multiswitch-double .vik-multiswitch-radiobtn input:checked + .vik-multiswitch-trigger + .vik-multiswitch-txt {
1349 color: #444;
1350 }
1351
1352 /* Reports */
1353 .vbo-reports-output.vbo-report-output-rms_occupancy_pace table tbody .vbo-report-row-group-1 td {
1354 background: var(--vbo-basic-btn-hover);
1355 }
1356 .vbo-reports-output.vbo-report-output-rms_occupancy_pace table tbody tr.vbo-report-row-comparison td {
1357 border-top: 1px solid #1f232b;
1358 }
1359
1360 /* Quotations */
1361 .vbo-quote-option-summary {
1362 color: #fff;
1363 }
1364 .btn.vbo-quote-option-room-extra-add-btn {
1365 background-color: var(--vbo-basic-btn-hover);
1366 border-color: var(--vbo-config-border-color);
1367 color: var(--vbo-body-text-color);
1368 }
1369 .btn.vbo-quote-option-room-extra-add-btn:hover {
1370 background-color: var(--vbo-basic-btn);
1371 border-color: var(--vbo-config-border-color);
1372 }
1373
1374 /* Pagination */
1375 .pagination-links .button:not(.disabled) {
1376 border: 1px solid var(--vbo-light-color-btn) !important;
1377 background: var(--vbo-config-bg-color) !important;
1378 border-color: var(--vbo-contrast-text-color);
1379 }
1380 .pagination-links .button:not(.disabled):hover, .pagination-links .button:not(.disabled):focus {
1381 border-color: var(--vbo-base-color) !important;
1382 color: var(--vbo-base-color) !important;
1383 }
1384 .pagination-links .button.disabled {
1385 background: var(--vbo-basic-btn) !important;
1386 color: var(--vbo-config-title-color) !important;
1387 border-color: var(--vbo-config-border-color) !important;
1388 }
1389
1390 /* WhatsApp Business */
1391 .vcm-wa-tpl-prevw-content-inner {
1392 background-color: #144d37;
1393 }
1394 .vcm-wa-tpl-prevw-content-inner:after {
1395 border-color: transparent #144d37 transparent transparent;
1396 }
1397 .vcm-wa-tpl-prevw-content {
1398 background-color: #161717;
1399 }