www-thermferm/jqwidgets/styles/jqx.light.css

changeset 617
b216f9d4b917
parent 511
2d1d43c3a2c2
equal deleted inserted replaced
616:e2b82881c13e 617:b216f9d4b917
1 .jqx-widget-light { 1 :root {
2 font-family: "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif; 2 --jqx-primary-rgb: 0, 92, 153;
3 font-size:14px; 3 --jqx-primary: rgb(var(--jqx-primary-rgb));
4 color: #555; 4 --jqx-primary-color: #fff;
5 } 5 --jqx-background: #fff;
6 .jqx-widget-content-light { 6 --jqx-background-color: rgba(0,0,0, .88);
7 font-family: "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif; 7 --jqx-background-hover-rgb: 225, 225, 225;
8 font-size:14px; 8 --jqx-background-hover: rgb(var(--jqx-background-hover-rgb));
9 color: #555; 9 --jqx-background-color-hover: rgba(0,0,0,.54);
10 } 10 --jqx-surface-rgb: 255, 255, 255;
11 .jqx-widget-header-light { 11 --jqx-surface: rgb(var(--jqx-surface-rgb));
12 font-family: "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif; 12 --jqx-surface-color: rgba(0,0,0, .88);
13 font-size:14px; 13 --jqx-border: #E0E0E0;
14 background: #fff; 14 --jqx-scrollbar-background: #f5f5f5;
15 color: #555; 15 --jqx-scrollbar-border: #ddd;
16 } 16 --jqx-scrollbar-thumb-background: #C1C1C1;
17 17 --jqx-scrollbar-thumb-border: #b3b3b3;
18 --jqx-scrollbar-thumb-background-hover: #e6e6e6;
19 --jqx-scrollbar-thumb-border-hover: #b3b3b3;
20 --jqx-scrollbar-thumb-background-pressed: #d9d9d9;
21 --jqx-scrollbar-thumb-border-pressed: #b3b3b3;
22 --jqx-scrollbar-button-color-hover: #333;
23 --jqx-scrollbar-button-background-hover: #f5f5f5;
24 --jqx-scrollbar-button-border-hover: #f5f5f5;
25 --jqx-scrollbar-button-color-pressed: #333;
26 --jqx-scrollbar-button-background-pressed: #f5f5f5;
27 --jqx-scrollbar-button-border-pressed: #f5f5f5;
28 }
29
30 .jqx-icon-search-light,
31 .jqx-icon-close-light {
32 background-image: none;
33 font-family: jqx-icons;
34 }
35 .jqx-icon-close-light:after {
36 content: var(--jqx-icon-close);
37 }
38 .jqx-icon-search-light:after {
39 content: var(--jqx-icon-search);
40 color:
41
42 }
43 .jqx-calendar-light {
44 width: 280px !important;
45 height: 280px !important;
46 }
47 .jqx-fill-state-normal-light {
48 background: var(--jqx-background);
49 color: var(--jqx-background-color);
50 border-color: var(--jqx-border);
51 }
52 .jqx-fill-state-hover-light {
53 background: var(--jqx-background-hover);
54 color: var(--jqx-background-color-hover);
55 border-color: var(--jqx-background-hover);
56 }
57 .jqx-fill-state-pressed-light {
58 background: var(--jqx-primary);
59 color: var(--jqx-primary-color);
60 border-color: var(--jqx-primary);
61 }
62
63 @font-face {
64 font-family: jqx-icons;
65 src: local('./font/jqx-icons'), url('./font/jqx-icons.woff2') format('woff2'), url('./font/jqx-icons.woff') format('woff'), url('./font/jqx-icons.ttf') format('truetype'), url('./font/jqx-icons.eot') format('embedded-opentype');
66 font-weight: normal;
67 font-style: normal;
68 }
18 /*Rounded Corners*/ 69 /*Rounded Corners*/
19 /*top-left rounded Corners*/ 70 /*top-left rounded Corners*/
20 .jqx-rc-tl-light { 71 .jqx-rc-tl-light {
21 -moz-border-radius-topleft: 4px; 72 border-top-left-radius: var(--jqx-border-radius);
22 -webkit-border-top-left-radius: 4px;
23 border-top-left-radius: 4px;
24 } 73 }
25 /*top-right rounded Corners*/ 74 /*top-right rounded Corners*/
26 .jqx-rc-tr-light { 75 .jqx-rc-tr-light {
27 -moz-border-radius-topright: 4px; 76 border-top-right-radius: var(--jqx-border-radius);
28 -webkit-border-top-right-radius: 4px;
29 border-top-right-radius: 4px;
30 } 77 }
31 /*bottom-left rounded Corners*/ 78 /*bottom-left rounded Corners*/
32 .jqx-rc-bl-light { 79 .jqx-rc-bl-light {
33 -moz-border-radius-bottomleft: 4px; 80 border-bottom-left-radius: var(--jqx-border-radius);
34 -webkit-border-bottom-left-radius: 4px;
35 border-bottom-left-radius: 4px;
36 } 81 }
37 /*bottom-right rounded Corners*/ 82 /*bottom-right rounded Corners*/
38 .jqx-rc-br-light { 83 .jqx-rc-br-light {
39 -moz-border-radius-bottomright: 4px; 84 border-bottom-right-radius: var(--jqx-border-radius);
40 -webkit-border-bottom-right-radius: 4px;
41 border-bottom-right-radius: 4px;
42 } 85 }
43 /*top rounded Corners*/ 86 /*top rounded Corners*/
44 .jqx-rc-t-light { 87 .jqx-rc-t-light {
45 -moz-border-radius-topleft: 4px; 88 border-top-left-radius: var(--jqx-border-radius);
46 -webkit-border-top-left-radius: 4px; 89 border-top-right-radius: var(--jqx-border-radius);
47 border-top-left-radius: 4px;
48 -moz-border-radius-topright: 4px;
49 -webkit-border-top-right-radius: 4px;
50 border-top-right-radius: 4px;
51 } 90 }
52 /*bottom rounded Corners*/ 91 /*bottom rounded Corners*/
53 .jqx-rc-b-light { 92 .jqx-rc-b-light {
54 -moz-border-radius-bottomleft: 4px; 93 border-bottom-left-radius: var(--jqx-border-radius);
55 -webkit-border-bottom-left-radius: 4px; 94 border-bottom-right-radius:var(--jqx-border-radius);
56 border-bottom-left-radius: 4px;
57 -moz-border-radius-bottomright: 4px;
58 -webkit-border-bottom-right-radius: 4px;
59 border-bottom-right-radius: 4px;
60 } 95 }
61 /*right rounded Corners*/ 96 /*right rounded Corners*/
62 .jqx-rc-r-light { 97 .jqx-rc-r-light {
63 -moz-border-radius-topright: 4px; 98 border-top-right-radius: var(--jqx-border-radius);
64 -webkit-border-top-right-radius: 4px; 99 border-bottom-right-radius: var(--jqx-border-radius);
65 border-top-right-radius: 4px;
66 -moz-border-radius-bottomright: 4px;
67 -webkit-border-bottom-right-radius: 4px;
68 border-bottom-right-radius: 4px;
69 } 100 }
70 /*left rounded Corners*/ 101 /*left rounded Corners*/
71 .jqx-rc-l-light { 102 .jqx-rc-l-light {
72 -moz-border-radius-topleft: 4px; 103 border-top-left-radius: var(--jqx-border-radius);
73 -webkit-border-top-left-radius: 4px; 104 border-bottom-left-radius: var(--jqx-border-radius);
74 border-top-left-radius: 4px;
75 -moz-border-radius-bottomleft: 4px;
76 -webkit-border-bottom-left-radius: 4px;
77 border-bottom-left-radius: 4px;
78 } 105 }
79 /*all rounded Corners*/ 106 /*all rounded Corners*/
80 .jqx-rc-all-light { 107 .jqx-rc-all-light {
81 -moz-border-radius: 4px; 108 border-radius: var(--jqx-border-radius);
82 -webkit-border-radius: 4px;
83 border-radius: 4px;
84 } 109 }
85 110
86 .jqx-widget-light, .jqx-widget-header-light, .jqx-fill-state-normal-light, 111 .jqx-widget-light, .jqx-widget-header-light, .jqx-fill-state-normal-light,
87 .jqx-widget-content-light, .jqx-fill-state-hover-light, .jqx-fill-state-pressed-light { 112 .jqx-widget-content-light, .jqx-fill-state-hover-light, .jqx-fill-state-pressed-light {
113 font-family: var(--jqx-font-family);
114 font-size: var(--jqx-font-size);
115 }
116
117 .jqx-widget-light {
118 font-family: var(--jqx-font-family);
119 font-size: var(--jqx-font-size);
120 color: inherit;
121 border-color:var(--jqx-border);
122 }
123
124 .jqx-widget-content-light {
88 font-family: "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif; 125 font-family: "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif;
89 font-size:14px; 126 font-size: 14px;
90 } 127 color: var(--jqx-background-color);
91 128 background-color: var(--jqx-background);
92 .jqx-widget-content-light { 129 border-color: var(--jqx-border);
93 background-color: #ffffff; 130 }
94 border-color: #dddddd; 131 .jqx-grid-table-light.jqx-grid-table-one-cell {
132 border-right-color: var(--jqx-border);
95 } 133 }
96 .jqx-widget-header-light { 134 .jqx-widget-header-light {
97 color: #555; 135 background-color: var(--jqx-surface);
98 background-color:#f8f8f8; 136 border-color: var(--jqx-border);
99 border-color:#dddddd; 137 font-weight: 500;
138 font-family: "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif;
139 font-size: 14px;
140 background: var(--jqx-surface);
141 color: var(--jqx-surface-color);
142 }
143
144 .jqx-calendar-title-header-light {
145 text-transform: uppercase;
146 }
147 .jqx-window-header-light {
148 padding: 10px;
149 text-transform: uppercase;
150 color: var(--jqx-surface-color);
151 background: var(--jqx-surface);
152 }
153 .jqx-calendar tr {
154 border-bottom-color: var(--jqx-border);
155 }
156
157
158 .jqx-widget-light input::selection, input.jqx-input-widget-light::selection, .jqx-widget-content-light input::selection {
159 background: var(--jqx-primary);
160 color: var(--jqx-primary-color);
161 }
162 .jqx-toolbar-light{
163 border-color: var(--jqx-border);
164 }
165
166 .jqx-toolbar-light {
167 height: auto !important;
168 display: flex;
169 align-items: center;
170 }
171
172 .jqx-button-light, .jqx-button-light.jqx-fill-state-normal-light {
173 color: var(--jqx-background-color);
174 background-color: var(--jqx-background);
175 border-color: var(--jqx-border);
176 text-transform: uppercase;
177 text-overflow: ellipsis;
178 overflow: hidden;
179 white-space: nowrap;
180 outline: none;
181 transition: box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1);
182 border-radius: 4px;
183 box-shadow: 0 0 0 0 rgba(0,0,0,.2), 0 0 0 0 rgba(0,0,0,.14), 0 0 0 0 var(--jqx-border);
184 }
185 .jqx-button-light.jqx-fill-state-hover-light,
186 .jqx-button-light.jqx-fill-state-pressed-light {
187 background-color: var(--jqx-background-hover);
188 border-color: var(--jqx-border);
189 color: var(--jqx-background-color-hover);
190 }
191
192 .jqx-button-light.primary {
193 color: var(--jqx-primary-color);
194 background-color: var(--jqx-primary);
195 border-color: var(--jqx-primary);
196 }
197 .jqx-button-light.jqx-fill-state-hover-light.primary,
198 .jqx-button-light.jqx-fill-state-pressed-light.primary {
199 color: var(--jqx-primary-color);
200 background-color: var(--jqx-primary);
201 border-color: var(--jqx-primary);
202 }
203 .jqx-button-light.secondary,
204 .jqx-button-light.jqx-toolbar-tool {
205 background-color: var(--jqx-surface);
206 border-color: var(--jqx-border);
207 color: var(--jqx-surface-color) !important;
208 }
209 .jqx-button-light.secondary:hover,
210 .jqx-button-light.jqx-toolbar-tool:hover {
211 background-color: var(--jqx-background-hover);
212 border-color: var(--jqx-border);
213 color: var(--jqx-background-color-hover) !important;
214 }
215 .jqx-button-light.secondary:active,
216 .jqx-button-light.jqx-toolbar-tool:active {
217 background-color: var(--jqx-surface);
218 border-color: var(--jqx-border);
219 color: var(--jqx-surface-color) !important;
220 }
221 .jqx-scheduler-edit-dialog-field .jqx-button-light {
222 padding: 6px 16px;
223 text-transform: uppercase;
224 }
225
226 .jqx-button-light button, jqx-button-light input {
227 background: transparent;
228 color: inherit;
229 border:none;
230 outline: none;
231 }
232 .jqx-group-button-normal-light{
233 box-shadow: none;
234 background: var(--jqx-background);
235 border-color: var(--jqx-border);
236 color: var(--jqx-background-color) !important;
237 border-radius:0px;
238 }
239 .jqx-group-button-normal.jqx-fill-state-hover {
240 box-shadow: none !important;
241 }
242 .jqx-group-button-normal.jqx-fill-state-pressed {
243 box-shadow: none !important;
244 background: var(--jqx-primary) !important;
245 border-color: var(--jqx-primary) !important;
246 color: var(--jqx-primary-color)!important;
247 border-radius:0px;
248 }
249
250
251 .jqx-slider-button-light {
252 padding:3px;
253 background: transparent;
254 border:transparent;
255 }
256 .jqx-button-light.float {
257 border-radius: 100%;
258 min-height: 48px;
259 min-width: 48px;
260 width: 48px;
261 height: 48px;
262 max-height: 48px;
263 max-width:48px;
264 }
265
266 .jqx-button-light.outlined {
267 background: transparent;
268 color: var(--jqx-primary);
269 border-width: 2px;
270 }
271
272 .jqx-button-light.flat {
273 background: transparent;
274 color: var(--jqx-primary);
275 border: none;
276 }
277
278 .jqx-fill-state-hover-light, .jqx-fill-state-focus-light {
279 text-decoration: none;
280 }
281
282 .jqx-expander-header.jqx-fill-state-hover-light,
283 .jqx-expander-header.jqx-fill-state-normal-light,
284 .jqx-expander-header.jqx-fill-state-pressed-light
285 {
286 background: var(--jqx-background-hover);
287 border-color: var(--jqx-border);
288 color:var(--jqx-background-color-hover);
289 }
290 .jqx-expander-header.jqx-fill-state-hover-light {
291 background: var(--jqx-background-hover);
292 }
293 .jqx-expander-content-light{
294 padding:0px;
295 }
296 .jqx-expander-header-light {
297 padding:10px;
298 }
299 .jqx-button-light.jqx-fill-state-hover {
300 opacity: 0.9;
301 cursor: pointer;
302 box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12);
100 *zoom: 1; 303 *zoom: 1;
101 -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); 304 }
102 -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); 305
103 box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); 306 .jqx-button-light.jqx-fill-state-hover.outlined,
104 } 307 .jqx-button-light.jqx-fill-state-hover.flat {
105 308 color: var(--jqx-primary);
106 .jqx-button-light, .jqx-fill-state-normal-light { 309 box-shadow: none;
107 color: #555; 310 }
108 background:#fafafa; 311
109 border-color: #dddddd; 312 .jqx-button-light.jqx-fill-state-pressed {
110 *zoom: 1; 313 cursor: pointer;
111 } 314 box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
112 315 }
113 .jqx-fill-state-hover-light { 316
114 color: #373a3c; 317 .jqx-button-light.jqx-fill-state-pressed.float {
115 border-color: #b2b2b2; 318 box-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 12px 17px 2px rgba(0, 0, 0, 0.14), 0px 5px 22px 4px rgba(0, 0, 0, 0.12);
116 border-color: rgba(0, 0, 0, 0.3); 319 }
117 background-color: #f0f0f0; 320
118 } 321 .jqx-slider-button-light.jqx-fill-state-pressed-light,
119 .jqx-fill-state-pressed-light { 322 .jqx-button-light.jqx-fill-state-pressed.outlined,
120 color: #fff !important; 323 .jqx-button-light.jqx-fill-state-pressed.flat {
121 background-color: #1ca8dd; 324 background: rgba(179,229,252,0.15);
122 border-color: #1ca8dd; 325 box-shadow: none;
123 *background-color: #fff; 326 color: var(--jqx-primary);
124 } 327 }
125 328
126 .jqx-fill-state-hover-light, .jqx-fill-state-focus-light { 329 .jqx-button-light.jqx-fill-state-focus {
127 color: #333333; 330 box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
128 text-decoration: none; 331 }
129 } 332 .jqx-slider-button-light.jqx-fill-state-focus-light {
130 333 background: transparent;
131 .jqx-button-light { 334 border-color: transparent;
132 color: #555; 335 box-shadow:none;
133 border-color: #ddd; 336 }
134 *zoom: 1; 337
135 } 338 .jqx-button-light.jqx-fill-state-focus.outlined,
136 339 .jqx-button-light.jqx-fill-state-focus.flat {
137 .jqx-button-light.jqx-fill-state-hover { 340 box-shadow: none;
138 341 background: rgba(rgb(var(--jqx-primary-rgb)),0.15);
139 *zoom: 1; 342 color: var(--jqx-primary);
140 -webkit-transition: background-color 100ms linear; 343 }
141 -moz-transition: background-color 100ms linear; 344
142 -o-transition: background-color 100ms linear; 345 .jqx-dropdownlist-content-light {
143 -ms-transition: background-color 100ms linear; 346 display: flex;
144 transition: background-color 100ms linear; 347 align-items: center;
145 } 348 height: 100% !important;
146 .jqx-button-light.jqx-fill-state-pressed { 349 margin-top: 0px !important;
147 color: #fff; 350 }
148 background:#1ca8dd; 351
149 border-color: #1ca8dd; 352 .jqx-dropdownlist-content-light span {
150 *zoom: 1; 353 top: 0px !important;
151 -webkit-transition: background-color 100ms linear; 354 }
152 -moz-transition: background-color 100ms linear;
153 -o-transition: background-color 100ms linear;
154 -ms-transition: background-color 100ms linear;
155 transition: background-color 100ms linear;
156 }
157
158 .jqx-dropdownlist-state-normal-light, .jqx-dropdownlist-state-hover-light, .jqx-dropdownlist-state-selected-light, 355 .jqx-dropdownlist-state-normal-light, .jqx-dropdownlist-state-hover-light, .jqx-dropdownlist-state-selected-light,
159 .jqx-scrollbar-button-state-hover-light, .jqx-scrollbar-button-state-normal-light, .jqx-scrollbar-button-state-pressed-light, 356 .jqx-scrollbar-button-state-hover-light, .jqx-scrollbar-button-state-normal-light, .jqx-scrollbar-button-state-pressed-light,
160 .jqx-scrollbar-thumb-state-normal-horizontal-light, .jqx-scrollbar-thumb-state-hover-horizontal-light, .jqx-scrollbar-thumb-state-pressed-horizontal-light, 357 .jqx-scrollbar-thumb-state-normal-horizontal-light, .jqx-scrollbar-thumb-state-hover-horizontal-light, .jqx-scrollbar-thumb-state-pressed-horizontal-light,
161 .jqx-scrollbar-thumb-state-normal-light, .jqx-scrollbar-thumb-state-pressed-light, .jqx-tree-item-hover-light, .jqx-tree-item-selected-light, 358 .jqx-scrollbar-thumb-state-normal-light, .jqx-scrollbar-thumb-state-pressed-light, .jqx-tree-item-hover-light, .jqx-tree-item-selected-light,
162 .jqx-tree-item-light, .jqx-menu-item-light, .jqx-menu-item-hover-light, .jqx-menu-item-selected-light, .jqx-menu-item-top-light, .jqx-menu-item-top-hover-light, 359 .jqx-tree-item-light, .jqx-menu-item-light, .jqx-menu-item-hover-light, .jqx-menu-item-selected-light, .jqx-menu-item-top-light, .jqx-menu-item-top-hover-light,
163 .jqx-menu-item-top-selected-light, .jqx-slider-button-light, .jqx-slider-slider-light 360 .jqx-menu-item-top-selected-light, .jqx-slider-button-light, .jqx-slider-slider-light {
164 {
165 -webkit-transition: background-color 100ms linear; 361 -webkit-transition: background-color 100ms linear;
166 -moz-transition: background-color 100ms linear; 362 -moz-transition: background-color 100ms linear;
167 -o-transition: background-color 100ms linear; 363 -o-transition: background-color 100ms linear;
168 -ms-transition: background-color 100ms linear; 364 -ms-transition: background-color 100ms linear;
169 transition: background-color 100ms linear; 365 transition: background-color 100ms linear;
170 } 366 }
171 .jqx-primary-light 367
172 { 368
173 color: #1ca8dd !important; 369 .jqx-primary-light.jqx-input-label-light {
174 background: #fff !important; 370 color: var(--jqx-primary) !important;
175 border-color: #1ca8dd!important; 371 }
176 text-shadow: none !important; 372 .jqx-primary-light.jqx-input-bar-light:before {
177 } 373 background: var(--jqx-primary) !important;
178 .jqx-primary-light.jqx-dropdownlist-state-normal-light, 374 }
179 .jqx-primary-light.jqx-slider-button-light, 375 .jqx-success-light.jqx-input-label-light {
180 .jqx-primary-light.jqx-slider-slider-light, 376 color: #5cb85c !important;
181 .jqx-primary-light.jqx-combobox-arrow-normal-light, 377 }
182 .jqx-primary-light.jqx-combobox-arrow-hover-light, 378 .jqx-success-light.jqx-input-bar-light:before {
183 .jqx-primary-light.jqx-action-button-light, 379 background: #5cb85c !important;
184 .jqx-primary-light:hover, 380 }
185 .jqx-primary-light:focus, 381 .jqx-inverse-light.jqx-input-label-light {
186 .jqx-primary-light:active, 382 color: #666 !important;
187 .jqx-primary-light.active, 383 }
188 .jqx-primary-light.disabled, 384 .jqx-inverse-light.jqx-input-bar-light:before {
189 .jqx-primary-light[disabled] { 385 background: #666 !important;
190 color: #fff !important; 386 }
191 background: #1ca8dd !important; 387 .jqx-danger-light.jqx-input-label-light {
192 border-color: #1ca8dd !important; 388 color: #d9534f !important;
193 text-shadow: none !important; 389 }
194 } 390 .jqx-danger-light.jqx-input-bar-light:before {
195 391 background: #d9534f !important;
196 .jqx-fill-state-pressed-light.jqx-primary-light, 392 }
197 .jqx-primary-light:active, 393 .jqx-warning-light.jqx-input-label-light {
198 .jqx-primary-light.active { 394 color: #f0ad4e !important;
199 color: #fff !important; 395 }
200 background-color: #1ca8dd !important; 396 .jqx-warning-light.jqx-input-bar-light:before {
201 border-color: #1ca8dd!important; 397 background: #f0ad4e !important;
202 text-shadow: none !important; 398 }
203 } 399 .jqx-info-light.jqx-input-label-light {
204 400 color: #5bc0de !important;
205 .jqx-success-light 401 }
206 { 402 .jqx-info-light.jqx-input-bar-light:before {
207 color: #5cb85c !important; 403 background: #5bc0de !important;
208 background: #fff !important; 404 }
209 border-color: #5cb85c!important; 405
210 text-shadow: none !important; 406 .jqx-slider-tooltip-light.jqx-primary-slider, .jqx-slider-tooltip-light.jqx-primary-slider .jqx-fill-state-normal-light {
211 } 407 border-color: var(--jqx-primary);
212 .jqx-success-light.jqx-dropdownlist-state-normal-light, 408 background: var(--jqx-primary);
213 .jqx-success-light.jqx-slider-button-light, 409 }
214 .jqx-success-light.jqx-slider-slider-light, 410 .jqx-slider-tooltip-light.jqx-success-slider, .jqx-slider-tooltip-light.jqx-success-slider .jqx-fill-state-normal-light {
215 .jqx-success-light.jqx-combobox-arrow-normal-light, 411 border-color: #5cb85c;
216 .jqx-success-light.jqx-combobox-arrow-hover-light, 412 background: #5cb85c;
217 .jqx-success-light.jqx-action-button-light, 413 }
218 .jqx-success-light:hover, 414 .jqx-slider-tooltip-light.jqx-inverse-slider, .jqx-slider-tooltip-light.jqx-inverse-slider .jqx-fill-state-normal-light {
219 .jqx-success-light:focus, 415 border-color: #666;
220 .jqx-success-light:active, 416 background: #666;
221 .jqx-success-light.active, 417 }
222 .jqx-success-light.disabled, 418 .jqx-slider-tooltip-light.jqx-danger-slider, .jqx-slider-tooltip-light.jqx-danger-slider .jqx-fill-state-normal-light {
223 .jqx-success-light[disabled] { 419 border-color: #d9534f;
224 color: #fff !important; 420 background: #d9534f;
225 background: #5cb85c !important; 421 }
226 border-color: #5cb85c!important; 422 .jqx-slider-tooltip-light.jqx-warning-slider, .jqx-slider-tooltip-light.jqx-warning-slider .jqx-fill-state-normal-light {
227 text-shadow: none !important; 423 border-color: #f0ad4e;
228 } 424 background: #f0ad4e;
229 425 }
230 .jqx-fill-state-pressed-light.jqx-success-light, 426 .jqx-slider-tooltip-light.jqx-info-slider, .jqx-slider-tooltip-light.jqx-info-slider .jqx-fill-state-normal-light {
231 .jqx-success-light:active, 427 border-color: #5bc0de;
232 .jqx-success-light.active { 428 background: #5bc0de;
233 text-shadow: none !important; 429 }
234 color: #fff !important; 430
235 background: #5cb85c !important; 431
236 border-color: #5cb85c!important; 432 .jqx-primary-light {
237 } 433 color: var(--jqx-primary) !important;
238 434 background: #fff !important;
239 .jqx-inverse-light 435 border-color: var(--jqx-primary) !important;
240 { 436 text-shadow: none !important;
241 text-shadow: none !important; 437 }
242 color: #666 !important; 438
243 background: #fff !important; 439 .jqx-primary-light.jqx-dropdownlist-state-normal-light,
244 border-color: #cccccc!important; 440 .jqx-primary-light.jqx-slider-button-light,
245 } 441 .jqx-primary-light.jqx-slider-slider-light,
246 .jqx-inverse-light.jqx-dropdownlist-state-normal-light, 442 .jqx-primary-light.jqx-combobox-arrow-normal-light,
247 .jqx-inverse-light.jqx-slider-button-light, 443 .jqx-primary-light.jqx-combobox-arrow-hover-light,
248 .jqx-inverse-light.jqx-slider-slider-light, 444 .jqx-primary-light.jqx-action-button-light,
249 .jqx-inverse-light.jqx-combobox-arrow-hover-light, 445 .jqx-primary-light:hover,
250 .jqx-inverse-light.jqx-combobox-arrow-normal-light, 446 .jqx-primary-light:focus,
251 .jqx-inverse-light.jqx-action-button-light, 447 .jqx-primary-light:active,
252 .jqx-inverse-light:hover, 448 .jqx-primary-light.active,
253 .jqx-inverse-light:focus, 449 .jqx-primary-light.disabled,
254 .jqx-inverse-light:active, 450 .jqx-primary-light[disabled] {
255 .jqx-inverse-light.active, 451 color: #fff !important;
256 .jqx-inverse-light.disabled, 452 background: var(--jqx-primary) !important;
257 .jqx-inverse-light[disabled] { 453 border-color: var(--jqx-primary) !important;
258 text-shadow: none !important; 454 text-shadow: none !important;
259 color: #666 !important; 455 }
260 background: #cccccc !important; 456
261 border-color: #cccccc!important; 457 .jqx-fill-state-pressed-light.jqx-primary-light,
262 } 458 .jqx-primary-light:active,
263 459 .jqx-primary-light.active {
264 .jqx-fill-state-pressed-light.jqx-inverse-light, 460 color: #fff !important;
265 .jqx-inverse-light:active, 461 background-color: var(--jqx-primary) !important;
266 .jqx-inverse-light.active { 462 border-color: var(--jqx-primary) !important;
267 text-shadow: none !important; 463 text-shadow: none !important;
268 color: #666 !important; 464 }
269 background: #cccccc !important; 465
270 border-color: #cccccc!important; 466 .jqx-success-light {
271 } 467 color: #5cb85c !important;
272 468 background: #fff !important;
273 469 border-color: #5cb85c !important;
274 .jqx-danger-light 470 text-shadow: none !important;
275 { 471 }
276 text-shadow: none !important; 472
277 color: #d9534f !important; 473 .jqx-success-light.jqx-dropdownlist-state-normal-light,
278 background: #fff !important; 474 .jqx-success-light.jqx-slider-button-light,
279 border-color: #d9534f!important; 475 .jqx-success-light.jqx-slider-slider-light,
280 } 476 .jqx-success-light.jqx-combobox-arrow-normal-light,
281 .jqx-danger-light.jqx-dropdownlist-state-normal-light, 477 .jqx-success-light.jqx-combobox-arrow-hover-light,
282 .jqx-danger-light.jqx-slider-button-light, 478 .jqx-success-light.jqx-action-button-light,
283 .jqx-danger-light.jqx-slider-slider-light, 479 .jqx-success-light:hover,
284 .jqx-danger-light.jqx-combobox-arrow-hover-light, 480 .jqx-success-light:focus,
285 .jqx-danger-light.jqx-combobox-arrow-normal-light, 481 .jqx-success-light:active,
286 .jqx-danger-light.jqx-action-button-light, 482 .jqx-success-light.active,
287 .jqx-danger-light:hover, 483 .jqx-success-light.disabled,
288 .jqx-danger-light:focus, 484 .jqx-success-light[disabled] {
289 .jqx-danger-light:active, 485 color: #fff !important;
290 .jqx-danger-light.active, 486 background: #5cb85c !important;
291 .jqx-danger-light.disabled, 487 border-color: #5cb85c !important;
292 .jqx-danger-light[disabled] { 488 text-shadow: none !important;
293 text-shadow: none !important; 489 }
294 color: #fff !important; 490
295 background: #d9534f !important; 491 .jqx-fill-state-pressed-light.jqx-success-light,
296 border-color: #d9534f!important; 492 .jqx-success-light:active,
297 } 493 .jqx-success-light.active {
298 494 text-shadow: none !important;
299 .jqx-fill-state-pressed-light.jqx-danger-light, 495 color: #fff !important;
300 .jqx-danger-light:active, 496 background: #5cb85c !important;
301 .jqx-danger-light.active { 497 border-color: #5cb85c !important;
302 text-shadow: none !important; 498 }
303 color: #fff !important; 499
304 background: #d9534f !important; 500 .jqx-inverse-light {
305 border-color: #d9534f!important; 501 text-shadow: none !important;
306 } 502 color: #666 !important;
307 503 background: #fff !important;
308 504 border-color: #cccccc !important;
309 .jqx-warning-light 505 }
310 { 506
311 text-shadow: none !important; 507 .jqx-inverse-light.jqx-dropdownlist-state-normal-light,
312 color: #f0ad4e !important; 508 .jqx-inverse-light.jqx-slider-button-light,
313 background: #fff !important; 509 .jqx-inverse-light.jqx-slider-slider-light,
314 border-color: #f0ad4e!important; 510 .jqx-inverse-light.jqx-combobox-arrow-hover-light,
315 } 511 .jqx-inverse-light.jqx-combobox-arrow-normal-light,
316 .jqx-warning-light.jqx-dropdownlist-state-normal-light, 512 .jqx-inverse-light.jqx-action-button-light,
317 .jqx-warning-light.jqx-slider-button-light, 513 .jqx-inverse-light:hover,
318 .jqx-warning-light.jqx-slider-slider-light, 514 .jqx-inverse-light:focus,
319 .jqx-warning-light.jqx-combobox-arrow-hover-light, 515 .jqx-inverse-light:active,
320 .jqx-warning-light.jqx-combobox-arrow-normal-light, 516 .jqx-inverse-light.active,
321 .jqx-warning-light.jqx-action-button-light, 517 .jqx-inverse-light.disabled,
322 .jqx-warning-light:hover, 518 .jqx-inverse-light[disabled] {
323 .jqx-warning-light:focus, 519 text-shadow: none !important;
324 .jqx-warning-light:active, 520 color: #666 !important;
325 .jqx-warning-light.active, 521 background: #cccccc !important;
326 .jqx-warning-light.disabled, 522 border-color: #cccccc !important;
327 .jqx-warning-light[disabled] { 523 }
328 text-shadow: none !important; 524
329 color: #fff !important; 525 .jqx-fill-state-pressed-light.jqx-inverse-light,
330 background: #f0ad4e !important; 526 .jqx-inverse-light:active,
331 border-color: #f0ad4e!important; 527 .jqx-inverse-light.active {
332 } 528 text-shadow: none !important;
333 529 color: #666 !important;
334 .jqx-fill-state-pressed-light.jqx-warning-light, 530 background: #cccccc !important;
335 .jqx-warning-light:active, 531 border-color: #cccccc !important;
336 .jqx-warning-light.active { 532 }
337 text-shadow: none !important; 533
338 color: #fff !important; 534
339 background: #f0ad4e !important; 535 .jqx-danger-light {
340 border-color: #f0ad4e!important; 536 text-shadow: none !important;
341 } 537 color: #d9534f !important;
342 538 background: #fff !important;
343 539 border-color: #d9534f !important;
344 .jqx-info-light 540 }
345 { 541
346 text-shadow: none !important; 542 .jqx-danger-light.jqx-dropdownlist-state-normal-light,
347 color: #5bc0de !important; 543 .jqx-danger-light.jqx-slider-button-light,
348 background: #fff !important; 544 .jqx-danger-light.jqx-slider-slider-light,
349 border-color: #5bc0de!important; 545 .jqx-danger-light.jqx-combobox-arrow-hover-light,
350 } 546 .jqx-danger-light.jqx-combobox-arrow-normal-light,
351 .jqx-info-light.jqx-dropdownlist-state-normal-light, 547 .jqx-danger-light.jqx-action-button-light,
352 .jqx-info-light.jqx-slider-button-light, 548 .jqx-danger-light:hover,
353 .jqx-info-light.jqx-slider-slider-light, 549 .jqx-danger-light:focus,
354 .jqx-info-light.jqx-combobox-arrow-hover-light, 550 .jqx-danger-light:active,
355 .jqx-info-light.jqx-combobox-arrow-normal-light, 551 .jqx-danger-light.active,
356 .jqx-info-light.jqx-action-button-light, 552 .jqx-danger-light.disabled,
357 .jqx-info-light:hover, 553 .jqx-danger-light[disabled] {
358 .jqx-info-light:focus, 554 text-shadow: none !important;
359 .jqx-info-light:active, 555 color: #fff !important;
360 .jqx-info-light.active, 556 background: #d9534f !important;
361 .jqx-info-light.disabled, 557 border-color: #d9534f !important;
362 .jqx-info-light[disabled] { 558 }
363 color: #fff !important; 559
364 background: #5bc0de !important; 560 .jqx-fill-state-pressed-light.jqx-danger-light,
365 border-color: #5bc0de!important; 561 .jqx-danger-light:active,
366 text-shadow: none !important; 562 .jqx-danger-light.active {
367 } 563 text-shadow: none !important;
368 564 color: #fff !important;
369 .jqx-fill-state-pressed-light.jqx-info-light, 565 background: #d9534f !important;
370 .jqx-info-light:active, 566 border-color: #d9534f !important;
371 .jqx-info-light.active { 567 }
372 text-shadow: none !important; 568
373 color: #fff !important; 569 .jqx-validator-error-label-light {
374 background: #5bc0de !important; 570 color: #d9534f !important;
375 border-color: #5bc0de!important; 571 }
376 } 572
573 .jqx-warning-light {
574 text-shadow: none !important;
575 color: #f0ad4e !important;
576 background: #fff !important;
577 border-color: #f0ad4e !important;
578 }
579
580 .jqx-warning-light.jqx-dropdownlist-state-normal-light,
581 .jqx-warning-light.jqx-slider-button-light,
582 .jqx-warning-light.jqx-slider-slider-light,
583 .jqx-warning-light.jqx-combobox-arrow-hover-light,
584 .jqx-warning-light.jqx-combobox-arrow-normal-light,
585 .jqx-warning-light.jqx-action-button-light,
586 .jqx-warning-light:hover,
587 .jqx-warning-light:focus,
588 .jqx-warning-light:active,
589 .jqx-warning-light.active,
590 .jqx-warning-light.disabled,
591 .jqx-warning-light[disabled] {
592 text-shadow: none !important;
593 color: #fff !important;
594 background: #f0ad4e !important;
595 border-color: #f0ad4e !important;
596 }
597
598 .jqx-fill-state-pressed-light.jqx-warning-light,
599 .jqx-warning-light:active,
600 .jqx-warning-light.active {
601 text-shadow: none !important;
602 color: #fff !important;
603 background: #f0ad4e !important;
604 border-color: #f0ad4e !important;
605 }
606
607
608 .jqx-info-light {
609 text-shadow: none !important;
610 color: #5bc0de !important;
611 background: #fff !important;
612 border-color: #5bc0de !important;
613 }
614
615 .jqx-info-light.jqx-dropdownlist-state-normal-light,
616 .jqx-info-light.jqx-slider-button-light,
617 .jqx-info-light.jqx-slider-slider-light,
618 .jqx-info-light.jqx-combobox-arrow-hover-light,
619 .jqx-info-light.jqx-combobox-arrow-normal-light,
620 .jqx-info-light.jqx-action-button-light,
621 .jqx-info-light:hover,
622 .jqx-info-light:focus,
623 .jqx-info-light:active,
624 .jqx-info-light.active,
625 .jqx-info-light.disabled,
626 .jqx-info-light[disabled] {
627 color: #fff !important;
628 background: #5bc0de !important;
629 border-color: #5bc0de !important;
630 text-shadow: none !important;
631 }
632
633 .jqx-fill-state-pressed-light.jqx-info-light,
634 .jqx-info-light:active,
635 .jqx-info-light.active {
636 text-shadow: none !important;
637 color: #fff !important;
638 background: #5bc0de !important;
639 border-color: #5bc0de !important;
640 }
377 641
378 .jqx-fill-state-pressed-light { 642 .jqx-fill-state-pressed-light {
379 background-image: none; 643 background-image: none;
380 outline: 0; 644 outline: 0;
381 } 645 }
382 646
647 .jqx-grid-group-column-light {
648 border-color: transparent;
649 }
650 .jqx-grid-column-menubutton-light {
651 border-width: 0px;
652 }
653 .jqx-grid-groups-row-light > span {
654 padding-left: 4px;
655 }
656 .jqx-grid-column-filterbutton-light,
657 .jqx-grid-column-menubutton-light{
658 background-image: none;
659 font-family: 'jqx-icons';
660 display: flex;
661 justify-content: center;
662 align-items: center;
663 margin-top: 0px;
664 }
665
666 .jqx-grid-column-filterbutton-light:after {
667 content: var(--jqx-icon-filter);
668 background: var(--jqx-surface);
669 color: var(--jqx-surface-color);
670 }
671 .jqx-grid-column-menubutton-light:after {
672 content: var(--jqx-icon-menu) !important;
673 background: var(--jqx-surface);
674 color: var(--jqx-surface-color);
675 }
676 .jqx-datatable-dark .jqx-widget-header-dark .jqx-grid-column-header-dark {
677 border-right-color: var(--jqx-border);
678 }
679
680 .jqx-datatable-light .jqx-widget-header:not(:hover) .jqx-grid-column-header-light{
681 border-right-color: transparent !important;
682 }
683
684 .jqx-datatable-light td.jqx-grid-cell-light,
685 .jqx-treegrid-light .jqx-grid-cell-light{
686 padding-top: 10px;
687 padding-bottom: 9px;
688 font-size: 14px;
689 border-left: none !important;
690 }
691
383 .jqx-grid-cell-light { 692 .jqx-grid-cell-light {
693 background: var(--jqx-background);
694 color: var(--jqx-background-color);
384 -webkit-box-shadow: none; 695 -webkit-box-shadow: none;
385 -moz-box-shadow: none; 696 -moz-box-shadow: none;
386 box-shadow: none; 697 box-shadow: none;
387 } 698 }
699 .jqx-grid-cell-alt-light {
700 background: #fafafa;
701 color: var(--jqx-surface-color);
702 }
703
704 .jqx-grid-pager-top-light .jqx-button-light,
705 .jqx-grid-pager-light .jqx-button-light {
706 color: inherit !important;
707 background-color: transparent !important;
708 border-color: transparent !important;
709 position: relative;
710 top: 0px;
711 border-radius: 4px;
712 display: flex;
713 font-size: 16px;
714 justify-content: center;
715 align-content: center;
716 }
717
718 .jqx-grid-pager-input-light {
719 padding:0px !important;
720 }
721
722 .jqx-grid-pager-top-light .jqx-button-light > div,
723 .jqx-grid-pager-light .jqx-button-light > div {
724 top: 0px;
725 position: relative;
726 left: 0px;
727 display: flex;
728 align-items: center;
729 margin-left: 0px !important;
730 }
731
732 .jqx-grid-pager-top-light .jqx-button-light.jqx-fill-state-hover,
733 .jqx-grid-pager-light .jqx-button-light.jqx-fill-state-hover
734 {
735 color: var(--jqx-background-color-hover);
736 background: var(--jqx-background-hover);
737 border-color: var(--jqx-background-hover);
738 box-shadow: none;
739 }
740 .jqx-grid-pager-top-light .jqx-button-light.jqx-fill-state-pressed,
741 .jqx-grid-pager-light .jqx-button-light.jqx-fill-state-pressed
742 {
743 background: var(--jqx-primary);
744 }
745 .jqx-grid-pager-light .jqx-button-light:hover:after,
746 .jqx-grid-pager-top-light .jqx-button-light:hover:after,
747 .jqx-grid-pager-top-light .jqx-button-light.jqx-fill-state-pressed-light:after,
748 .jqx-grid-pager-light .jqx-button-light.jqx-fill-state-pressed-light:after {
749 content: '';
750 position: absolute;
751 width: calc(100% - 4px);
752 height: calc(100% - 4px);
753 border: 2px solid var(--jqx-background);
754 border-radius: 4px;
755 left:0px;
756 top:0px;
757 }
758 .jqx-grid-pager-top-light .jqx-grid-pager-number-light,
759 .jqx-grid-pager-light .jqx-grid-pager-number-light {
760 background-color: transparent;
761 border-color: transparent;
762 color: inherit;
763 font-size:14px;
764 padding: 6px 10px;
765 border-radius: 4px;
766
767 position: relative;
768 }
769
770 .jqx-grid-pager-top-light .jqx-grid-pager-number-light:hover,
771 .jqx-grid-pager-light .jqx-grid-pager-number-light:hover {
772 background: var(--jqx-background-hover);
773 color:var(--jqx-background-color-hover) !important;
774 font-size: var(--jqx-font-size);
775 }
776 .jqx-grid-pager-light .jqx-grid-pager-number-light:hover:after,
777 .jqx-grid-pager-top-light .jqx-grid-pager-number-light:hover:after,
778 .jqx-grid-pager-top-light .jqx-grid-pager-number-light.jqx-fill-state-pressed-light:after,
779 .jqx-grid-pager-light .jqx-grid-pager-number-light.jqx-fill-state-pressed-light:after {
780 content: '';
781 position: absolute;
782 width: calc(100% - 4px);
783 height: calc(100% - 4px);
784 border: 2px solid var(--jqx-background);
785 border-radius: var(--jqx-border-radius);
786 left:0px;
787 top:0px;
788 }
789 .jqx-grid-pager-top-light .jqx-grid-pager-number-light.jqx-fill-state-pressed-light ,
790 .jqx-grid-pager-light .jqx-grid-pager-number-light.jqx-fill-state-pressed-light {
791 font-weight: bold !important;
792 background: var(--jqx-primary);
793 color:var(--jqx-background) !important;
794 }
388 795
389 .jqx-grid-column-menubutton-light { 796 .jqx-grid-column-menubutton-light {
390 background-color: transparent; 797 background-color: transparent;
391 border-color: #ddd !important; 798 border-color: var(--jqx-border) !important;
392 } 799 }
800
393 .jqx-cell-light { 801 .jqx-cell-light {
394 font-size: 14px; 802 font-size: 13px;
803 }
804
805 .jqx-calendar-light > div {
806 padding: 0px;
807 box-sizing: border-box;
808 }
809 .jqx-calendar-month-light {
810 width: 90%;
811 position: relative;
812 left: 5%;
813 }
814 .jqx-calendar-title-navigation-light {
815 font-size: 20px;
816 padding: 0px 20px;
395 } 817 }
396 .jqx-calendar-row-header-light, .jqx-calendar-top-left-header-light { 818 .jqx-calendar-row-header-light, .jqx-calendar-top-left-header-light {
397 background-color: #f0f0f0; 819 background-color: var(--jqx-background);
398 border: 0px solid #f2f2f2; 820 border: 0px solid var(--jqx-background);
399 } 821 }
400 822
401 .jqx-calendar-column-header-light { 823 .jqx-calendar-column-header-light {
402 background-color: #FFF; 824 background-color: var(--jqx-background);
403 border-top: 1px solid #FFF; 825 border-top: 1px solid var(--jqx-background);
404 border-bottom: 1px solid #e9e9e9; 826 border-bottom: 1px solid var(--jqx-border);
827 font-size: 12px;
828 color: var(--jqx-background-color);
405 } 829 }
406 830
407 .jqx-expander-header-light { 831 .jqx-expander-header-light {
408 padding-top: 10px; padding-bottom: 10px; 832 padding-top: 10px;
409 } 833 padding-bottom: 10px;
834 }
835
410 .jqx-ribbon-header-vertical-light, .jqx-widget-header-vertical-light { 836 .jqx-ribbon-header-vertical-light, .jqx-widget-header-vertical-light {
411 background:#f0f0f0; 837 background: var(--jqx-background);
412 background:-ms-linear-gradient(left, #f8f8f8 0%,#eaeaea 100%);
413 background:linear-gradient(left, #f8f8f8 0%,#eaeaea 100%);
414 } 838 }
415 839
416 .jqx-scrollbar-state-normal-light { 840 .jqx-scrollbar-state-normal-light {
417 background-color: #f8f8f8; 841 background-color: var(--jqx-scrollbar-background);
418 border: 1px solid #f8f8f8; 842 border: 1px solid var(--jqx-scrollbar-background);
843 border-left-color: var(--jqx-scrollbar-border);
419 } 844 }
420 845
421 .jqx-scrollbar-thumb-state-normal-light, .jqx-scrollbar-thumb-state-normal-horizontal-light { 846 .jqx-scrollbar-thumb-state-normal-light, .jqx-scrollbar-thumb-state-normal-horizontal-light {
422 background: #f5f5f5; 847 background: var(--jqx-scrollbar-thumb-background);
423 border-color: #b3b3b3; 848 border-color: var(--jqx-scrollbar-thumb-border);
849 border-radius: 0px;
424 } 850 }
425 851
426 .jqx-scrollbar-thumb-state-hover-light, .jqx-scrollbar-thumb-state-hover-horizontal-light { 852 .jqx-scrollbar-thumb-state-hover-light, .jqx-scrollbar-thumb-state-hover-horizontal-light {
427 background: #e6e6e6; 853 background: var(--jqx-scrollbar-thumb-background-hover);
428 border-color: #b3b3b3; 854 border-color: var(--jqx-scrollbar-thumb-border-hover);
429 box-shadow: none; 855 box-shadow: none;
430 -webkit-box-shadow: none; 856 -webkit-box-shadow: none;
431 -moz-box-shadow: none; 857 -moz-box-shadow: none;
432 } 858 }
433 859
434 .jqx-progressbar-light { 860 .jqx-progressbar-light {
435 background: #f7f7f7 !important; 861 background: var(--jqx-background) !important;
436 -webkit-box-shadow: none; 862 -webkit-box-shadow: none;
437 -moz-box-shadow: none; 863 -moz-box-shadow: none;
438 box-shadow: none; 864 box-shadow: none;
439 } 865 }
440 866
441 .jqx-progressbar-value-light, .jqx-splitter-collapse-button-horizontal-light { 867 .jqx-progressbar-value-light, .jqx-splitter-collapse-button-horizontal-light {
442 background: #1ca8dd; 868 background: var(--jqx-primary);
443 } 869 }
444 870
445 .jqx-splitter-collapse-button-vertical-light, .jqx-progressbar-value-vertical-light { 871 .jqx-splitter-collapse-button-vertical-light, .jqx-progressbar-value-vertical-light {
446 background: #1ca8dd; 872 background: var(--jqx-primary);
447 } 873 }
448 874
449 875 .jqx-scrollbar-mobile-light .jqx-scrollbar-button-state-normal {
450 .jqx-scrollbar-thumb-state-pressed-light, .jqx-splitter-splitbar-vertical-light, .jqx-splitter-splitbar-horizontal-light, .jqx-scrollbar-thumb-state-pressed-horizontal-light, 876 display: none !important;
451 .jqx-scrollbar-button-state-pressed-light 877 }
452 { 878
453 background: #d9d9d9; 879 .jqx-scrollbar-button-state-hover-light {
454 border-color: #b3b3b3; 880 color: var(--jqx-scrollbar-button-color-hover);
455 box-shadow: none; 881 background: var(--jqx-scrollbar-button-background-hover);
456 -webkit-box-shadow: none; 882 border-color: var(--jqx-scrollbar-button-border-hover);
457 -moz-box-shadow: none; 883 }
884
885
886 .jqx-scrollbar-button-state-pressed-light {
887 color: var(--jqx-scrollbar-button-color-pressed);
888 background: var(--jqx-scrollbar-button-background-pressed);
889 border-color: var(--jqx-scrollbar-button-border-pressed);
890 }
891
892 .jqx-splitter-splitbar-vertical-light,
893 .jqx-splitter-splitbar-horizontal-light {
894 background: var(--jqx-scrollbar-thumb-background);
895 border-color: var(--jqx-scrollbar-thumb-border);
896 }
897
898 .jqx-scrollbar-thumb-state-pressed-light,
899 .jqx-scrollbar-thumb-state-pressed-horizontal-light,
900 .jqx-scrollbar-button-state-pressed-light {
901 background: var(--jqx-scrollbar-thumb-background-pressed);
902 border-color: var(--jqx-scrollbar-thumb-border-pressed);
903 box-shadow: none;
458 } 904 }
459 905
460 .jqx-grid-column-sortdescbutton-light, jqx-grid-column-filterbutton-light, .jqx-grid-column-sortascbutton-light { 906 .jqx-grid-column-sortdescbutton-light, jqx-grid-column-filterbutton-light, .jqx-grid-column-sortascbutton-light {
461 background-color: transparent; 907 background-color: transparent;
462 border-style: solid; 908 border-style: solid;
463 border-width: 0px 0px 0px 0px; 909 border-width: 0px 0px 0px 0px;
464 border-color: #ddd; 910 border-color: var(--jqx-border);
465 } 911 }
466 912
467 .jqx-menu-vertical-light { 913 .jqx-menu-vertical-light {
468 background: #ffffff; 914 background: var(--jqx-background);
469 filter: none; 915 filter: none;
470 } 916 }
471 917
472 .jqx-checkbox-check-checked-light {
473 background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAsAAAALCAYAAACprHcmAAAAcklEQVQY02NgwA/YoJgoEA/Es4DYgJBCJSBeD8SboRinBiYg7kZS2IosyQ/Eakh8LySFq4FYHFlxGRBvBOJYqMRqJMU+yApNkSRAeC0Sux3dfSCTetE0wKyXxOWhMKhTYIr9CAUXyJMzgLgBagBBgDPGAI2LGdNt0T1AAAAAAElFTkSuQmCC');
474 }
475 .jqx-checkbox-hover {
476 box-shadow: none;
477 -webkit-box-shadow: none;
478 -moz-box-shadow: none;
479 }
480 .jqx-combobox-content-light, .jqx-input-light {
481 }
482
483 .jqx-combobox-content-light {
484 border-color: #ddd;
485 border-color: rgba(0, 0, 0, 0.25);
486 }
487
488 .jqx-grid-bottomright-light, .jqx-panel-bottomright-light, .jqx-listbox-bottomright-light { 918 .jqx-grid-bottomright-light, .jqx-panel-bottomright-light, .jqx-listbox-bottomright-light {
489 background-color: #f8f8f8; 919 background-color: var(--jqx-scrollbar-background);
490 } 920 }
491 921
492 .jqx-window-light, .jqx-tooltip-light { 922 .jqx-window-light, .jqx-tooltip-light {
493 box-shadow: 0 4px 23px 5px rgba(0, 0, 0, 0.2), 0 2px 6px rgba(0,0,0,0.15); 923 box-shadow: 0 4px 23px 5px rgba(0, 0, 0, 0.2), 0 2px 6px rgba(0,0,0,0.15);
494 } 924 }
495 925 .jqx-tooltip-light, .jqx-tooltip-light.jqx-popup-light, .jqx-tooltip-light .jqx-fill-state-normal-light {
926 background: var(--jqx-primary);
927 border-color: var(--jqx-primary);
928 box-shadow:none;
929 color: var(--jqx-primary-color);
930 }
496 .jqx-docking-light .jqx-window-light { 931 .jqx-docking-light .jqx-window-light {
497 box-shadow: none; 932 box-shadow: none;
498 } 933 }
499 934
500 .jqx-docking-panel-light .jqx-window-light { 935 .jqx-docking-panel-light .jqx-window-light {
501 box-shadow: none; 936 box-shadow: none;
502 } 937 }
503 938
939 .jqx-checkbox-light {
940 line-height:20px;
941 overflow: visible;
942 }
504 .jqx-radiobutton-light { 943 .jqx-radiobutton-light {
944 overflow: visible;
505 box-shadow: none; 945 box-shadow: none;
506 -webkit-box-shadow: none; 946 -webkit-box-shadow: none;
507 -moz-box-shadow: none; 947 -moz-box-shadow: none;
508 background-repeat: no-repeat; 948 background-repeat: no-repeat;
509 background: none; 949 background: none;
950 line-height:20px;
510 } 951 }
511 952
512 .jqx-radiobutton-light-light, .jqx-radiobutton-hover-light { 953 .jqx-radiobutton-light-light, .jqx-radiobutton-hover-light {
513 -moz-border-radius: 100%;
514 -webkit-border-radius: 100%;
515 border-radius: 100%; 954 border-radius: 100%;
516 background-repeat: no-repeat; 955 background-repeat: no-repeat;
956 transition: background-color ease-in .3s;
517 } 957 }
518 958
519 .jqx-radiobutton-check-checked-light { 959 .jqx-radiobutton-check-checked-light {
520 filter: none; 960 filter: none;
521 background: #1ca8dd; 961 background: var(--jqx-background);
522 background-repeat: no-repeat; 962 background-repeat: no-repeat;
523 -moz-border-radius: 100%;
524 -webkit-border-radius: 100%;
525 border-radius: 100%; 963 border-radius: 100%;
526 } 964 }
527 965
528 .jqx-radiobutton-check-indeterminate-light { 966 .jqx-radiobutton-check-indeterminate-light {
529 filter: none; 967 filter: none;
530 background: #999; 968 background: var(--jqx-background);
531 -moz-border-radius: 100%;
532 -webkit-border-radius: 100%;
533 border-radius: 100%; 969 border-radius: 100%;
534 } 970 }
535 971
536 .jqx-radiobutton-check-indeterminate-disabled-light { 972 .jqx-radiobutton-check-indeterminate-disabled-light {
537 filter: none; 973 filter: none;
538 background: #999; 974 background: var(--jqx-background);
539 -moz-border-radius: 100%; 975 opacity: 0.7;
540 -webkit-border-radius: 100%;
541 border-radius: 100%; 976 border-radius: 100%;
542 } 977 }
543 978
979 .jqx-checkbox-default-light,
980 .jqx-radiobutton-default-light
981 {
982 border-width: 1px;
983 border-color: var(--jqx-border);
984 background-color: var(--jqx-background);
985 overflow: visible;
986 }
987
988 .jqx-tree-grid-expand-button-light,
989 .jqx-tree-grid-collapse-button-light {
990 font-size: 16px;
991 }
992 .jqx-grid-table-light .jqx-grid-cell:first-child {
993 padding-left: 10px;
994 }
995 .jqx-tree-grid-title-light {
996 margin-left: 5px;
997 }
998 .jqx-tree-light .jqx-checkbox-light .jqx-checkbox-default-light,
999 .jqx-checkbox-light[checked] .jqx-checkbox-default-light,
1000 .jqx-tree-grid-checkbox[checked].jqx-checkbox-default-light,
1001 .jqx-radiobutton-light[checked] .jqx-radiobutton-default-light
1002 {
1003 color: var(--jqx-primary-color);
1004 background-color: var(--jqx-primary);
1005 border-color: var(--jqx-primary);
1006 }
1007 .jqx-menu-item-disabled-light {
1008 color: inherit;
1009 }
1010
1011 .jqx-grid-light .jqx-checkbox-default-light {
1012 border-radius: 0px;
1013 }
1014 .jqx-checkbox-check-checked-light {
1015 background: none;
1016 font-family: jqx-icons;
1017 display: flex;
1018 justify-content: center;
1019 }
1020
1021 .jqx-checkbox-check-checked-light:after {
1022 content: var(--jqx-icon-check);
1023 }
1024 .jqx-checkbox-check-indeterminate-light {
1025 width:14px !important;
1026 height:14px !important;
1027 position:relative;
1028 top: 1px;
1029 left: 1px;
1030 background: var(--jqx-background);
1031 }
1032 .jqx-tree-light .jqx-checkbox-check-indeterminate-light {
1033 width:12px !important;
1034 height:12px !important;
1035 top: 2px;
1036 left:2px;
1037 }
1038
1039 .jqx-checkbox-hover-light,
1040 .jqx-radiobutton-hover-light {
1041 background-color: var(--jqx-primary);
1042 border-color: var(--jqx-primary);
1043 }
1044
1045
1046 .jqx-slider-slider-light {
1047 transition: box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.5s ease;
1048 }
1049
1050 .jqx-slider-slider-light:active {
1051 transform: scale(1.2);
1052 box-shadow: rgba(0,0,0,0.3) 0 0 10px;
1053 }
1054 .jqx-slider-light[discrete] .jqx-slider-slider-light:active
1055 {
1056 transform: scaleX(0);
1057
1058 }
1059 .jqx-slider-slider-horizontal-light {
1060 background: var(--jqx-primary);
1061 }
1062 .jqx-slider-slider-vertical-light {
1063 background: var(--jqx-primary);
1064 }
1065 .jqx-slider-tooltip-light {
1066 width: 25px;
1067 height: 25px;
1068 transform-origin: 50% 100%;
1069 border-radius: 50%;
1070 transform: scale(0) rotate(45deg);
1071 padding:0px;
1072 background: transparent !important;
1073 }
1074 .jqx-slider-tooltip-light.init {
1075 transform: scale(1) rotate(45deg);
1076 }
1077 .jqx-slider-tooltip-light.hide {
1078 transition: transform 0.2s ease;
1079 transform-origin:50% 100%;
1080 transform: scale(0) rotate(45deg);
1081 }
1082 .jqx-slider-tooltip-light.show {
1083 transition: transform 0.2s ease;
1084 transform: scale(1) rotate(45deg);
1085 }
1086
1087
1088 .jqx-slider-tooltip-light .jqx-tooltip-arrow-t-b,
1089 .jqx-slider-tooltip-light .jqx-tooltip-arrow-l-r {
1090 display:none;
1091 visibility:hidden;
1092 }
1093
1094 .jqx-slider-tooltip-light, .jqx-slider-tooltip-light .jqx-fill-state-normal-light {
1095 border-radius: 15px 15px 0px;
1096 display: flex;
1097 align-items: center;
1098 justify-content: center;
1099 background: var(--jqx-primary);
1100 color: var(--jqx-primary-color);
1101 font-size:11px;
1102 }
1103 .jqx-slider-tooltip-light.far, .jqx-slider-tooltip-light.far .jqx-fill-state-normal-light {
1104 border-radius: 0px 15px 15px 15px;
1105 }
1106 .jqx-slider-tooltip-light.vertical, .jqx-slider-tooltip-light.vertical .jqx-fill-state-normal-light {
1107 border-radius: 15px 0px 15px 15px;
1108 }
1109 .jqx-slider-tooltip-light.vertical.far, .jqx-slider-tooltip-light.vertical.far .jqx-fill-state-normal-light {
1110 border-radius: 15px 15px 15px 0px;
1111 }
1112 .jqx-slider-tooltip-light {
1113 background:transparent;
1114 border:none !important;
1115 box-shadow:none;
1116 }
1117 .jqx-slider-tooltip-light .jqx-tooltip-main-light {
1118 top: -7px;
1119 right: 11px;
1120 }
1121 .jqx-slider-tooltip-light.far .jqx-tooltip-main-light {
1122 top: 3px;
1123 right: 4px;
1124 }
1125 .jqx-slider-tooltip-light.vertical .jqx-tooltip-main-light {
1126 top: -3px;
1127 right: 3px;
1128 }
1129 .jqx-slider-tooltip-light .jqx-tooltip-text {
1130 background: transparent;
1131 border:none;
1132 padding: 0px;
1133 overflow:visible;
1134 }
1135 .jqx-slider-tooltip-light .jqx-tooltip-text>span {
1136 transform: rotate(-45deg);
1137 }
1138 .jqx-slider-tooltip-light.range {
1139 width: 35px;
1140 height:35px;
1141 }
1142
1143 .jqx-slider-rangebar-light {
1144 border-color: var(--jqx-primary);
1145 background: var(--jqx-primary);
1146 }
1147
544 .jqx-slider-track-horizontal-light, .jqx-slider-track-vertical-light { 1148 .jqx-slider-track-horizontal-light, .jqx-slider-track-vertical-light {
545 border-color: #ddd; 1149 border-color: var(--jqx-border);
546 background: #f0f0f0; 1150 background: var(--jqx-background);
547 } 1151 }
548 1152
549 .jqx-slider-button-light { 1153 .jqx-slider-button-light {
550 -moz-border-radius: 100%; 1154 -moz-border-radius: 100%;
551 -webkit-border-radius: 100%; 1155 -webkit-border-radius: 100%;
552 border-radius: 100%; 1156 border-radius: 100%;
553 } 1157 }
554 1158 .jqx-slider-button-light.jqx-fill-state-normal-light,
1159 .jqx-slider-button-light.jqx-fill-state-hover-light,
1160 .jqx-slider-button-light.jqx-fill-state-pressed-light
1161 {
1162 background: transparent !important;
1163 }
1164
1165 .jqx-tree-item-light,
1166 .jqx-tree-item-selected {
1167 padding: 6px;
1168 border-radius: 4px;
1169 }
1170 .jqx-listitem-element-light .jqx-checkbox-default-light {
1171 border-radius: 0px;
1172 }
1173 .jqx-listitem-state-hover-light,
1174 .jqx-listitem-state-selected-light,
1175 .jqx-listitem-state-normal-light {
1176 border-radius: 0;
1177 margin:0px;
1178 }
1179
1180 .jqx-scheduler-edit-dialog-label-light {
1181 font-size: 12px;
1182 text-transform: uppercase;
1183 padding-top: 6px;
1184 padding-bottom: 6px;
1185
1186 }
1187 .jqx-scheduler-edit-dialog-field-light {
1188 padding-top: 6px;
1189 padding-bottom: 6px;
1190 }
1191 .jqx-scheduler-edit-dialog-label-rtl-light {
1192 line-height: 35px;
1193 padding-top: 6px;
1194 padding-bottom: 6px;
1195 }
1196 .jqx-scheduler-edit-dialog-field-rtl-light {
1197 line-height: 35px;
1198 padding-top: 6px;
1199 padding-bottom: 6px;
1200 }
1201 .jqx-menu-horizontal-light {
1202 height: auto !important;
1203 }
1204 .jqx-menu-horizontal-light .jqx-menu-item-top-light {
1205 padding: 8px;
1206 }
1207 .jqx-menu-item-top-light,
1208 .jqx-menu-item-light {
1209 padding: 8px;
1210 }
555 /*applied to a list item when the item is selected.*/ 1211 /*applied to a list item when the item is selected.*/
556 .jqx-listitem-state-hover-light, .jqx-menu-item-hover-light, .jqx-tree-item-hover-light, .jqx-calendar-cell-hover-light, .jqx-grid-cell-hover-light, 1212 .jqx-listitem-state-hover-light, .jqx-menu-item-hover-light, .jqx-tree-item-hover-light, .jqx-calendar-cell-hover-light, .jqx-grid-cell-hover-light,
557 .jqx-menu-vertical-light .jqx-menu-item-top-hover-light, .jqx-input-popup-light .jqx-fill-state-hover-light, 1213 .jqx-input-popup-light .jqx-fill-state-hover-light,
558 .jqx-input-popup-light .jqx-fill-state-pressed-light { 1214 .jqx-input-popup-light .jqx-fill-state-pressed-light {
559 color: #137499 !important; 1215 color: var(--jqx-background-color-hover) !important;
560 border-color: #e3f5fb; 1216 border-color: var(--jqx-background-hover);
561 text-decoration: none; 1217 text-decoration: none;
562 background-color: #e3f5fb; 1218 background-color: var(--jqx-background-hover);
563 background-repeat: repeat-x; 1219 background-repeat: repeat-x;
564 outline: 0; 1220 outline: 0;
565 background: #e3f5fb; /* Old browsers */ 1221 background: var(--jqx-background-hover);
1222 box-shadow: none;
1223 background-position: 0 0;
1224 }
1225
1226 .jqx-scheduler-cell-hover-light {
1227 border-color: var(--jqx-primary) !important;
1228 background: var(--jqx-primary) !important;
1229 color: var(--jqx-background) !important;
1230 }
1231
1232 .jqx-listitem-state-selected-light, .jqx-menu-item-selected-light, .jqx-tree-item-selected-light, .jqx-calendar-cell-selected-light, .jqx-grid-cell-selected-light,
1233 .jqx-menu-item-top-selected-light, .jqx-grid-selectionarea-light, .jqx-input-button-header-light, .jqx-input-button-innerHeader-light {
1234 color: var(--jqx-primary-color) !important;
1235 border-color: var(--jqx-primary) !important;
1236 background: var(--jqx-primary) !important; /* Old browsers */
1237 box-shadow: none;
1238 }
1239
1240 .jqx-grid-cell-light .jqx-button-light, .jqx-grid-cell-light .jqx-button-light.jqx-fill-state-hover-light, .jqx-grid-cell-light .jqx-button-light.jqx-fill-state-pressed-light {
1241 box-shadow: none;
1242 transition: none;
1243 }
1244
1245 .jqx-menu-popup-light{
1246 opacity: 0;
1247 transform-origin: top left;
1248 box-shadow: 0 8px 10px 1px rgba(0,0,0,.14),0 3px 14px 3px rgba(0,0,0,.12),0 4px 15px 0 rgba(0,0,0,.2);
1249 background: var(--jqx-background) !important;
1250 }
1251 .jqx-menu-popup-light.top {
1252 transform: scaleY(0);
1253 transition: transform 0.2s ease-in-out, opacity 0.3s ease-in-out;
1254 }
1255
1256 .jqx-menu-popup-light.horizontal {
1257 transform: scaleX(0);
1258 transition: transform 0.2s ease-in-out, opacity 0.3s ease-in-out;
1259 }
1260
1261 .jqx-menu-popup-light.show {
1262 transform: scale(1);
1263 opacity: 1;
1264 }
1265 .jqx-popup-light {
1266 border: 1px solid var(--jqx-border);
1267 background: var(--jqx-background);
1268 box-shadow: 0 8px 10px 1px rgba(0,0,0,.14),0 3px 14px 3px rgba(0,0,0,.12),0 4px 15px 0 rgba(0,0,0,.2);
1269 }
1270 .jqx-menu-popup-light .jqx-popup-light {
1271 box-shadow: none;
1272 border: none;
1273 }
1274
1275 .jqx-datatable-light .jqx-grid-column-sortdescbutton-light,
1276 .jqx-datatable-light .jqx-grid-column-sortascbutton-light {
1277 display: flex;
1278 align-items: center;
1279 }
1280
1281 .jqx-grid-column-sortascbutton-light,
1282 .jqx-expander-arrow-bottom-light,
1283 .jqx-window-collapse-button-light,
1284 .jqx-menu-item-arrow-up-light,
1285 .jqx-menu-item-arrow-up-selected-light,
1286 .jqx-menu-item-arrow-top-up-light,
1287 .jqx-icon-arrow-up-light,
1288 .jqx-icon-arrow-up-hover-light,
1289 .jqx-icon-arrow-up-selected-light {
1290 background-image: none;
1291 }
1292
1293 .jqx-grid-column-sortascbutton-light,
1294 .jqx-expander-arrow-bottom-light,
1295 .jqx-window-collapse-button-light,
1296 .jqx-menu-item-arrow-up-light,
1297 .jqx-menu-item-arrow-up-selected-light,
1298 .jqx-menu-item-arrow-top-up-light,
1299 .jqx-icon-arrow-up-light,
1300 .jqx-icon-arrow-up-hover-light,
1301 .jqx-icon-arrow-up-selected-light {
1302 background-image: none;
1303 font-family: jqx-icons;
1304 }
1305 .jqx-window-collapse-button-light {
1306 position: relative;
1307 right: 10px;
1308 font-weight: bold;
1309 font-size: 18px;
1310 margin-top:0px;
1311 }
1312 .jqx-grid-column-sortascbutton-light:after,
1313 .jqx-expander-arrow-bottom-light:after,
1314 .jqx-window-collapse-button-light:after,
1315 .jqx-menu-item-arrow-up-light:after,
1316 .jqx-menu-item-arrow-up-selected-light:after,
1317 .jqx-menu-item-arrow-top-up-light:after,
1318 .jqx-icon-arrow-up-light:after,
1319 .jqx-icon-arrow-up-hover-light:after,
1320 .jqx-icon-arrow-up-selected-light:after {
1321 content: var(--jqx-icon-arrow-up);
1322 }
1323
1324 .jqx-widget-light .jqx-grid-group-expand-light,
1325 .jqx-grid-group-expand-light,
1326 .jqx-grid-column-sortdescbutton-light,
1327 .jqx-expander-arrow-top-light,
1328 .jqx-window-collapse-button-collapsed-light,
1329 .jqx-menu-item-arrow-down-light,
1330 .jqx-menu-item-arrow-down-selected-light,
1331 .jqx-menu-item-arrow-down-light,
1332 .jqx-icon-arrow-down-light,
1333 .jqx-icon-arrow-down-hover-light,
1334 .jqx-icon-arrow-down-selected-light {
1335 background-image: none;
1336 font-family: jqx-icons;
1337 }
1338 .jqx-widget-light .jqx-grid-group-expand-light:after,
1339 .jqx-grid-group-expand-light:after,
1340 .jqx-grid-column-sortdescbutton-light:after,
1341 .jqx-expander-arrow-top-light:after,
1342 .jqx-window-collapse-button-collapsed-light:after,
1343 .jqx-menu-item-arrow-down-light:after,
1344 .jqx-menu-item-arrow-down-selected-light:after,
1345 .jqx-menu-item-arrow-down-light:after,
1346 .jqx-icon-arrow-down-light:after,
1347 .jqx-icon-arrow-down-hover-light:after,
1348 .jqx-icon-arrow-down-selected-light:after {
1349 content: var(--jqx-icon-arrow-down);
1350 }
1351
1352 .jqx-tabs-arrow-left-light,
1353 .jqx-menu-item-arrow-left-selected-light,
1354 .jqx-menu-item-arrow-top-left,
1355 .jqx-icon-arrow-left-light,
1356 .jqx-icon-arrow-down-left-light,
1357 .jqx-icon-arrow-left-selected-light {
1358 background-image: none;
1359 font-family: jqx-icons;
1360 background-repeat: no-repeat;
1361 background-position: center;
1362 }
1363 .jqx-tabs-arrow-left-light:after,
1364 .jqx-menu-item-arrow-left-selected-light:after,
1365 .jqx-menu-item-arrow-top-left:after,
1366 .jqx-icon-arrow-left-light:after,
1367 .jqx-icon-arrow-down-left-light:after,
1368 .jqx-icon-arrow-left-selected-light:after {
1369 content: var(--jqx-icon-arrow-left);
1370 }
1371
1372 .jqx-widget-light .jqx-grid-group-collapse-light,
1373 .jqx-grid-group-collapse-light,
1374 .jqx-tabs-arrow-right-light,
1375 .jqx-menu-item-arrow-right-selected-light,
1376 .jqx-menu-item-arrow-top-right-light,
1377 .jqx-icon-arrow-right-light,
1378 .jqx-icon-arrow-right-hover-light,
1379 .jqx-icon-arrow-right-selected-light {
1380 background-image: none;
1381 font-family: jqx-icons;
1382 background-repeat: no-repeat;
1383 background-position: center;
1384 }
1385 .jqx-widget-light .jqx-grid-group-collapse-light:after,
1386 .jqx-grid-group-collapse-light:after,
1387 .jqx-tabs-arrow-right-light:after,
1388 .jqx-menu-item-arrow-right-selected-light:after,
1389 .jqx-menu-item-arrow-top-right-light:after,
1390 .jqx-icon-arrow-right-light:after,
1391 .jqx-icon-arrow-right-hover-light:after,
1392 .jqx-icon-arrow-right-selected-light:after {
1393 content: var(--jqx-icon-arrow-right);
1394 }
1395
1396 .jqx-tree-item-arrow-collapse-rtl-light,
1397 .jqx-tree-item-arrow-collapse-hover-rtl-light {
1398 background-image: none;
1399 }
1400
1401 .jqx-tree-item-arrow-collapse-rtl-light:after,
1402 .jqx-tree-item-arrow-collapse-hover-rtl-light:after {
1403 content: var(--jqx-icon-arrow-left);
1404 }
1405
1406 .jqx-menu-item-arrow-left-selected-light {
1407 background-image: none;
1408 }
1409
1410 .jqx-menu-item-arrow-right-selected-light {
1411 background-image: none;
1412 }
1413
1414 .jqx-input-button-content-light {
1415 font-size: 10px;
1416 }
1417
1418 .jqx-widget .jqx-grid-column-header-cell-light {
1419 padding-top: 8px;
1420 padding-bottom: 8px;
1421 height:30px;
1422 }
1423
1424 .jqx-widget .jqx-grid-row-cell-light {
1425 padding-top: 8px;
1426 padding-bottom: 8px;
1427 height:30px;
1428 }
1429
1430 .jqx-listbox-container-light,
1431 .jqx-calendar-container-light {
1432 margin-left: -10px;
1433 }
1434 .jqx-calendar-container-light .jqx-popup,
1435 .jqx-calendar-light.jqx-popup,
1436 .jqx-listbox-light.jqx-popup {
1437 margin-left: 9px;
1438 }
1439
1440 .jqx-dropdownbutton-popup,
1441 .jqx-calendar-light.jqx-popup,
1442 .jqx-listbox-light.jqx-popup,
1443 .jqx-grid-menu.jqx-popup {
1444 transition: transform 0.25s ease-in-out, opacity 0.35s ease-in-out;
1445 transform: scaleY(0);
1446 opacity: 0;
1447 transform-origin: top left;
1448 display: block !important;
1449 }
1450
1451 .jqx-dropdownbutton-popup.jqx-popup-show,
1452 .jqx-calendar-light.jqx-popup-show,
1453 .jqx-listbox-light.jqx-popup-show,
1454 .jqx-grid-menu.jqx-popup-show {
1455 transform: scaleY(1);
1456 opacity: 1;
1457 }
1458
1459 .jqx-widget-light .jqx-grid-cell {
1460 border-color: var(--jqx-border);
1461 color: var(--jqx-background-color);
1462 }
1463
1464 .jqx-widget-light .jqx-grid-column-header, .jqx-widget-light .jqx-grid-group-cell {
1465 border-color: var(--jqx-border);
1466 color: var(--jqx-surface-color);
1467 background: var(--jqx-surface);
1468 }
1469
1470 .jqx-widget-light .jqx-grid-column-header-light {
1471 border-color: var(--jqx-border);
1472 font-size: 12px;
1473 color: var(--jqx-surface-color);
1474 font-weight: 500;
1475 }
1476
1477
1478 .jqx-widget-light .jqx-widget-header-light:hover .jqx-grid-column-header-light {
1479 border-right-color: var(--jqx-border) !important;
1480 border-bottom-color: var(--jqx-border) !important;
1481 }
1482 .jqx-widget-light .jqx-grid-cell-light {
1483 border-color: var(--jqx-border);
1484 }
1485 .jqx-widgets-light .jqx-scheduler-cell-selected span{
1486 color: var(--jqx-background) !important;
1487 }
1488 .jqx-scheduler-time-column-light,
1489 .jqx-scheduler-toolbar-light {
1490 background: var(--jqx-surface) !important;
1491 color: var(--jqx-surface-color) !important;
1492 border-color: var(--jqx-border) !important;
1493 }
1494
1495 .jqx-widget-light.jqx-scheduler-light .jqx-grid-cell-light,
1496 .jqx-widget-light.jqx-scheduler-light .jqx-grid-column-header-light {
1497 border-color: transparent;
1498 border-bottom-color: var(--jqx-border);
1499 }
1500
1501 .jqx-widget-light.jqx-scheduler-light td.jqx-grid-cell-light span{
1502 font-size: 10px;
1503 color: var(--jqx-background-color);
1504 }
1505 .jqx-widget-light.jqx-scheduler-light td.jqx-grid-cell-light.jqx-scheduler-cell-hover span,
1506 .jqx-widget-light.jqx-scheduler-light td.jqx-grid-cell-light.jqx-scheduler-cell-selected span{
1507 color:var(--jqx-primary-color);
1508 }
1509
1510 .jqx-passwordinput-password-icon-light,
1511 .jqx-passwordinput-password-icon-rtl-light {
1512 background-image: none;
1513 font-family: jqx-icons;
1514 color:var(--jqx-background-color);
1515 }
1516 .jqx-passwordinput-password-icon-light:after,
1517 .jqx-passwordinput-password-icon-rtl-light:after {
1518 content: var(--jqx-icon-visibility);
1519 }
1520
1521 .jqx-combobox-light .jqx-icon-close-light {
1522 background-image: none;
1523 font-family: jqx-icons;
1524 }
1525
1526 .jqx-combobox-multi-item-light {
1527 height: 30px;
1528 display: flex;
1529 justify-content: center;
1530 align-items: center;
1531 }
1532 .jqx-combobox-multi-item-light a {
1533 margin-right: 10px;
1534 }
1535 .jqx-combobox-light .jqx-icon-close-light:after {
1536 content: var(--jqx-icon-close);
1537 }
1538 .jqx-combobox-light, .jqx-input-light {
1539 border-color: var(--jqx-border);
1540 color: var(--jqx-background-color);
1541 background-color: var(--jqx-background);
1542 }
1543
1544 .jqx-combobox-content-light,
1545 .jqx-datetimeinput-content-light
1546 {
1547 border-color: transparent;
1548 }
1549
1550
1551 .jqx-combobox-content-focus-light,
1552 .jqx-combobox-state-focus-light,
1553 .jqx-numberinput-focus-light {
1554 outline: none;
1555 }
1556
1557 .jqx-input-group-light {
1558 position: relative;
1559 display: inline-block;
1560 overflow: visible;
1561 border: none;
1562 box-shadow: none;
1563 }
1564
1565 .jqx-input-group-light input {
1566 width: 100%;
1567 height: 100%;
1568 box-sizing: border-box;
1569 }
1570 .jqx-input-group-light textarea {
1571 width: 100%;
1572 height: 100%;
1573 outline: none;
1574 resize: none;
1575 border-left: none;
1576 border-right: none;
1577 border-top: none;
1578 border-bottom-color: var(--jqx-border);
1579 }
1580 .jqx-numberinput-light,
1581 .jqx-maskedinput-light
1582 {
1583 position:relative;
1584 }
1585 .jqx-numberinput-light input {
1586 height:100% !important;
1587 }
1588
1589 .jqx-input-light.jqx-validator-error-element {
1590 border-color: transparent !important;
1591 border-bottom: 1px solid #df2227 !important;
1592 }
1593 .jqx-input-light input,
1594 .jqx-dropdownlist-state-normal-light,
1595 .jqx-combobox-state-normal-light,
1596 .jqx-numberinput-light,
1597 .jqx-maskedinput-light,
1598 .jqx-datetimeinput-light
1599 {
1600 background: var(--jqx-surface);
1601 border-color: var(--jqx-surface);
1602 border-radius: 0;
1603 color: var(--jqx-surface-color);
1604 box-shadow: none;
1605 border-bottom: 1px solid var(--jqx-border);
1606 outline: none;
1607 }
1608 .jqx-numberinput-light .jqx-action-button-light{
1609 border-radius: 0;
1610 font-size:12px;
1611 }
1612 .jqx-numberinput-light .jqx-action-button-light > div {
1613 width: 100%;
1614 display: flex;
1615 align-items: center;
1616 justify-content: center;
1617 }
1618 .jqx-maskedinput-light,
1619 .jqx-combobox-light,
1620 .jqx-datetimeinput-light {
1621 background: var(--jqx-background);
1622 color: var(--jqx-background-color);
1623 border-color: var(--jqx-background);
1624 border-bottom: 1px solid var(--jqx-border);
1625 }
1626 .jqx-combobox-light .jqx-combobox-arrow-normal-light,
1627 .jqx-datetimeinput-light .jqx-action-button-light,
1628 .jqx-datetimeinput-light .jqx-action-button-rtl-light
1629 {
1630 background-color: var(--jqx-surface);
1631 border-color: var(--jqx-surface);
1632 color:var(--jqx-surface-color);
1633 }
1634 .jqx-datetimeinput-light, .jqx-datetimeinput-light > div,
1635 .jqx-numberinput-light, .jqx-numberinput-light > div,
1636 .jqx-maskedinput-light, .jqx-maskedinput-light > div,
1637 .jqx-dropdownlist-state-normal-light, .jqx-dropdownlist-state-normal-light > div, .jqx-dropdownlist-state-normal-light > div > div,
1638 .jqx-combobox-state-normal-light, .jqx-combobox-state-normal-light > div, .jqx-combobox-state-normal-light > div > div {
1639 overflow: visible !important;
1640 }
1641
1642 .jqx-input-light input:focus {
1643 border-radius: 0;
1644 box-shadow: none;
1645 }
1646
1647 .jqx-input-light input, input[type="text"].jqx-input-light, input[type="password"].jqx-input-light, input[type="text"].jqx-widget-content-light, input[type="textarea"].jqx-widget-content-light, textarea.jqx-input-light {
1648 font-size: var(--jqx-font-size);
1649 font-family: var(--jqx-font-family);
1650 resize: none;
1651 background: var(--jqx-background);
1652 color: var(--jqx-background-color);
1653 border: none;
1654 border-radius: 0;
1655 box-sizing:border-box;
1656 box-shadow: none;
1657 border-bottom: 1px solid var(--jqx-border);
1658 }
1659
1660 input[type="text"].jqx-widget-content-light,
1661 input[type="textarea"].jqx-widget-content-light {
1662 height: 100%;
1663 }
1664
1665
1666 .jqx-input-label {
1667 visibility:inherit;
1668 }
1669 .jqx-input-bar{
1670 visibility:inherit;
1671 }
1672 input:focus ~ .jqx-input-label-light,
1673 textarea:focus ~ .jqx-input-label-light,
1674 .jqx-input-widget-light[hint=true] .jqx-input-label,
1675 .jqx-text-area-light[hint=true] .jqx-input-label,
1676 .jqx-dropdownlist-state-selected-light .jqx-input-label,
1677 .jqx-dropdownlist-state-normal-light[hint=true] .jqx-input-label,
1678 .jqx-combobox-state-normal-light[hint=true] .jqx-input-label,
1679 .jqx-combobox-light .jqx-input-label.focused,
1680 .jqx-dropdownlist-light .jqx-input-label.focused,
1681 .jqx-datetimeinput-light[hint=true] .jqx-input-label,
1682 .jqx-maskedinput-light[hint=true] .jqx-input-label,
1683 .jqx-numberinput-light[hint=true] .jqx-input-label,
1684 .jqx-formattedinput-light[hint=true] .jqx-input-label
1685 {
1686 top: -15px;
1687 font-size: 12px;
1688 color: var(--jqx-primary);
1689 opacity: 1;
1690 }
1691 .jqx-dropdownlist-light[default-placeholder="true"] .jqx-input-label {
1692 visibility: hidden;
1693 }
1694
1695
1696 input:focus ~ .jqx-input-bar:before,
1697 textarea:focus ~ .jqx-input-bar:before,
1698 .jqx-dropdownlist-state-selected-light .jqx-input-bar:before,
1699 .jqx-dropdownlist-light .jqx-input-bar.focused:before,
1700 .jqx-combobox-light .jqx-input-bar.focused:before,
1701 .jqx-complex-input-group-light .jqx-input-bar.focused::before,
1702 .jqx-combobox-state-selected-light .jqx-input-bar:before {
1703 width: 100%;
1704 }
1705 .jqx-complex-input-group-light .jqx-fill-state-normal-light {
1706 border-color: var(--jqx-border);
1707 }
1708
1709 .jqx-input-widget-light.jqx-rtl > input {
1710 direction: rtl
1711 }
1712
1713 .jqx-input-label-light {
1714 color: var(--jqx-background-color);
1715 font-size: 14px;
1716 font-weight: normal;
1717 position: absolute;
1718 pointer-events: none;
1719 left: 2px;
1720 top:10px;
1721 opacity: 0;
1722 top: calc(50% - 7px);
1723 transition: 300ms ease all;
1724 }
1725 .jqx-input-label.initial {
1726 transition: none;
1727 }
1728 .jqx-input-bar-light {
1729 position: relative;
1730 display: block;
1731 z-index:1;
1732 }
1733
1734 .jqx-input-bar-light:before {
1735 content: '';
1736 height: 2px;
1737 width: 0;
1738 bottom: 0px;
1739 position: absolute;
1740 background: var(--jqx-primary);
1741 transition: 300ms ease all;
1742 left: 0%;
1743 }
1744 .jqx-formatted-input-spin-button-light, .jqx-input-group-addon-light {
1745 border-color: var(--jqx-background);
1746 color: var(--jqx-background-color);
1747 background: var(--jqx-background);
1748 }
1749 .jqx-dropdownlist-state-selected-light,
1750 .jqx-combobox-state-selected-light {
1751 color: var(--jqx-primary);
1752 background: var(--jqx-primary-color);
1753 border-color: var(--jqx-primary-color);
1754 }
1755
1756
1757 .jqx-dropdownlist-state-normal-light .jqx-icon-arrow-down-light,
1758 .jqx-combobox-state-normal-light .jqx-icon-arrow-down-light,
1759 .sorticon.descending .jqx-grid-column-sorticon-light,
1760 .jqx-tree-item-arrow-expand-light,
1761 .jqx-expander-header-light .jqx-icon-arrow-down
1762 {
1763 transform: rotate(0deg);
1764 display: flex;
1765 align-items: center;
1766 transition: transform 0.2s ease-out;
1767 }
1768 .jqx-expander-header-light .jqx-icon-arrow-up {
1769 transform: rotate(180deg);
1770 transition: transform 0.2s ease-out;
1771 font-family: jqx-icons;
1772 background-image: none;
1773 }
1774 .jqx-expander-header-light .jqx-icon-arrow-up:after {
1775 content: var(--jqx-icon-arrow-down);
1776 }
1777 .jqx-tree-item-arrow-expand-light,
1778 .jqx-tree-item-arrow-collapse-light
1779 {
1780 font-size: 16px;
1781 }
1782 .jqx-tree-item-arrow-expand-light {
1783 transform: rotate(180deg);
1784 }
1785
1786 .jqx-tree-item-arrow-expand-light:after {
1787 content: var(--jqx-icon-arrow-up);
1788 margin-left: 2px;
1789 }
1790 .jqx-tree-item-arrow-collapse-light
1791 {
1792 transform: rotate(0deg);
1793 background-image: none;
1794 background-repeat: no-repeat;
1795 background-position: center;
1796 transition: transform 0.2s ease-out;
1797 }
1798 .jqx-dropdownlist-state-selected-light .jqx-icon-arrow-down-light,
1799 .jqx-combobox-state-selected-light .jqx-icon-arrow-down-light,
1800 .sorticon.ascending .jqx-grid-column-sorticon-light
1801 {
1802 display: flex;
1803 align-items: center;
1804 transform: rotate(180deg);
1805 transition: transform 0.2s ease-out;
1806 left: -1px;
1807 }
1808 .jqx-combobox-state-selected-light .jqx-icon-arrow-down-light{
1809 left:-1px;
1810 }
1811 .jqx-listbox-container {
1812 margin-top: 1px;
1813 }
1814
1815 input[type="text"].jqx-input-light:-moz-placeholder, input[type="text"].jqx-widget-content-light:-moz-placeholder, input[type="textarea"].jqx-widget-content-light:-moz-placeholder, textarea.jqx-input-light:-moz-placeholder {
1816 color: #999999;
1817 }
1818
1819 input[type="text"].jqx-input-light:-webkit-input-placeholder, input[type="text"].jqx-widget-content-light:-webkit-input-placeholder, input[type="textarea"].jqx-widget-content-light:-webkit-input-placeholder, textarea.jqx-input-light:-webkit-input-placeholder {
1820 color: #999999;
1821 }
1822
1823 input[type="text"].jqx-input-light:-ms-input-placeholder, input[type="text"].jqx-widget-content-light:-ms-input-placeholder, input[type="textarea"].jqx-widget-content-light:-ms-input-placeholder, textarea.jqx-input-light:-ms-input-placeholder {
1824 color: #999999;
1825 }
1826
1827 .jqx-combobox-content-focus-light, .jqx-combobox-state-focus-light, .jqx-fill-state-focus-light,
1828 .jqx-numberinput-focus-light {
1829 outline: none;
1830 }
1831
1832 .jqx-popup-light.jqx-fill-state-focus-light {
1833 outline: none;
1834 border-color: var(--jqx-border) !important;
1835 }
1836
1837 .jqx-datetimeinput-content, .jqx-datetimeinput-container {
1838 overflow: visible !important;
1839 }
1840 .jqx-text-area-light, .jqx-text-area-light > div {
1841 overflow:visible !important;
1842 }
1843 .jqx-text-area-element-light {
1844 box-sizing: border-box;
1845 }
1846 .jqx-pivotgrid-content-wrapper.jqx-fill-state-normal-light {
1847 border-color: var(--jqx-border);
1848 }
1849
1850 .jqx-grid-cell-light.jqx-grid-cell-selected-light > .jqx-grid-group-expand-light {
1851 background-image: none;
1852 }
1853
1854 .jqx-grid-cell-light.jqx-grid-cell-selected-light > .jqx-grid-group-collapse-light {
1855 background-image: none;
1856 }
1857
1858 .jqx-grid-cell-light.jqx-grid-cell-selected-light > .jqx-grid-group-collapse-rtl-light {
1859 background-image: none;
1860 }
1861
1862 .jqx-grid-cell-light.jqx-grid-cell-selected-light > .jqx-grid-group-expand-rtl-light {
1863 background-image: none;
1864 }
1865 .jqx-tabs-title-selected-top-light, .jqx-tabs-selection-tracker-top-light {
1866 border-color: transparent;
1867 filter: none;
1868 background: inherit;
1869 color: inherit;
566 -webkit-box-shadow: none; 1870 -webkit-box-shadow: none;
567 -moz-box-shadow: none; 1871 -moz-box-shadow: none;
568 box-shadow: none; 1872 box-shadow: none;
569 background-position: 0 0; 1873 }
570 } 1874 .jqx-grid-cell-filter-row-light {
571 .jqx-scheduler-cell-hover-light { 1875 background-color: var(--jqx-surface);
572 border-color: #e3f5fb !important; 1876 }
573 background: #e3f5fb !important; 1877
574 } 1878 .jqx-tabs-title-light, .jqx-ribbon-item-light {
575 .jqx-grid-table-dark { 1879 color: inherit;
576 font-size: 14px; 1880 }
577 } 1881 .jqx-ribbon-item-selected-light {
578 1882 background: inherit;
579 1883 }
580 .jqx-listitem-state-selected-light, .jqx-menu-item-selected-light, .jqx-tree-item-selected-light, .jqx-calendar-cell-selected-light, .jqx-grid-cell-selected-light, 1884 .jqx-tabs-title-selected-bottom-light,
581 .jqx-menu-vertical-light .jqx-menu-item-top-selected-light, .jqx-grid-selectionarea-light, .jqx-input-button-header-light, .jqx-input-button-innerHeader-light { 1885 .jqx-tabs-title-selected-top-light
582 color: #ffffff !important; 1886 {
583 background-color: #1ca8dd; 1887 color: var(--jqx-primary);
584 *background-color: #1ca8dd; 1888 font-weight:500;
585 background-repeat: repeat-x; 1889 padding-top:5px;
586 border-color: #1ca8dd !important; 1890 padding-bottom:5px;
587 background: #1ca8dd; /* Old browsers */ 1891 }
1892 .jqx-tabs-title.jqx-fill-state-hover-light {
1893 border-color: transparent;
1894 }
1895 .jqx-ribbon-item-light {
1896 cursor: pointer;
1897 }
1898 .jqx-ribbon-item-selected-light {
1899 color: var(--jqx-primary);
1900 font-weight:500;
1901 border-color: transparent;
1902 }
1903
1904 .jqx-ribbon-item-hover-light {
1905 background: transparent;
1906 }
1907
1908 .jqx-ribbon-header-top-light {
1909 border-color: transparent;
1910 border-bottom-color: var(--jqx-border);
1911 }
1912
1913 .jqx-ribbon-header-bottom-light {
1914 border-color: transparent;
1915 border-top-color: var(--jqx-border);
1916 }
1917
1918 .jqx-ribbon-header-right-light {
1919 border-color: transparent;
1920 border-left-color:var(--jqx-border);
1921 }
1922
1923 .jqx-ribbon-header-left-light {
1924 border-color: transparent;
1925 border-right-color:var(--jqx-border);
1926 }
1927
1928 .jqx-tabs-title-selected-bottom-light, .jqx-tabs-selection-tracker-bottom-light {
1929 border-color: transparent;
1930 border-top: 1px solid var(--jqx-background);
1931 filter: none;
1932 background: var(--jqx-background);
588 -webkit-box-shadow: none; 1933 -webkit-box-shadow: none;
589 -moz-box-shadow: none; 1934 -moz-box-shadow: none;
590 box-shadow: none; 1935 box-shadow: none;
591 } 1936 }
592 .jqx-scheduler-cell-selected-light { 1937
593 border-color: #1ca8dd !important; 1938 .jqx-tabs-light, .jqx-ribbon-light {
594 background: #1ca8dd !important; 1939 border-color: transparent;
595 } 1940 }
596 .jqx-grid-cell-light .jqx-button-light, .jqx-grid-cell-light .jqx-button-light.jqx-fill-state-hover-light, .jqx-grid-cell-light .jqx-button-light.jqx-fill-state-pressed-light { 1941
597 -webkit-box-shadow: none; 1942 .jqx-tabs-header-light {
598 -moz-box-shadow: none; 1943 background: transparent;
599 box-shadow: none; 1944 }
600 -webkit-transition: none; 1945 .jqx-ribbon-header-light {
601 -moz-transition: none; 1946 background: var(--jqx-surface);
602 -o-transition: none; 1947 color: var(--jqx-surface-color);
603 transition: none; 1948 }
604 } 1949 .jqx-tabs-position-bottom .jqx-tabs-header-light {
605 1950 border-color: transparent;
606 .jqx-popup-light { 1951 }
607 border: 1px solid #ddd; 1952 .jqx-layout-light .jqx-tabs-header-light, .jqx-layout-light .jqx-ribbon-header-light {
608 *border-right-width: 2px; 1953 background: var(--jqx-background);
609 *border-bottom-width: 2px; 1954 border-color: var(--jqx-border);
610 -webkit-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.15); 1955 }
611 -moz-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.15); 1956 .jqx-tabs-title-bottom {
612 } 1957 border-color: transparent;
613 .jqx-grid-column-sortascbutton-light, .jqx-expander-arrow-bottom-light, .jqx-window-collapse-button-light, .jqx-menu-item-arrow-up-light, .jqx-menu-item-arrow-up-selected-light, .jqx-menu-item-arrow-top-up-light, .jqx-icon-arrow-up-light, .jqx-icon-arrow-up-hover-light, .jqx-icon-arrow-up-selected-light { 1958 }
614 background-image: url('images/metro-icon-up.png'); 1959 .jqx-tabs-title-hover-top-light, .jqx-tabs-title-hover-bottom-light, .jqx-tabs-header-light {
615 background-repeat: no-repeat; 1960 -webkit-box-shadow: none !important;
616 background-position: center;
617 }
618
619 .jqx-widget-light .jqx-grid-group-expand-light, .jqx-grid-group-expand-light, .jqx-grid-column-menubutton-light, .jqx-grid-column-sortdescbutton-light, .jqx-expander-arrow-top-light, .jqx-window-collapse-button-collapsed-light, .jqx-menu-item-arrow-down-light, .jqx-menu-item-arrow-down-selected-light, .jqx-menu-item-arrow-down-light, .jqx-icon-arrow-down-light, .jqx-icon-arrow-down-hover-light, .jqx-icon-arrow-down-selected-light {
620 background-image: url('images/metro-icon-down.png');
621 background-repeat: no-repeat;
622 background-position: center;
623 }
624
625 .jqx-tabs-arrow-left-light, .jqx-menu-item-arrow-left-selected-light, .jqx-menu-item-arrow-top-left, .jqx-icon-arrow-left-light, .jqx-icon-arrow-down-left-light, .jqx-icon-arrow-left-selected-light {
626 background-image: url('images/metro-icon-left.png');
627 background-repeat: no-repeat;
628 background-position: center;
629 }
630
631 .jqx-widget-light .jqx-grid-group-collapse-light, .jqx-grid-group-collapse-light, .jqx-tabs-arrow-right-light, .jqx-menu-item-arrow-right-selected-light, .jqx-menu-item-arrow-top-right-light, .jqx-icon-arrow-right-light, .jqx-icon-arrow-right-hover-light, .jqx-icon-arrow-right-selected-light {
632 background-image: url('images/metro-icon-right.png');
633 background-repeat: no-repeat;
634 background-position: center;
635 }
636
637 .jqx-tree-item-arrow-collapse-rtl-light, .jqx-tree-item-arrow-collapse-hover-rtl-light {
638 background-image: url(images/metro-icon-left.png);
639 }
640
641 .jqx-menu-item-arrow-left-selected-light {
642 background-image: url('images/metro-icon-left-white.png');
643 background-repeat: no-repeat;
644 background-position: center;
645 }
646
647 .jqx-menu-item-arrow-right-selected-light {
648 background-image: url('images/metro-icon-right-white.png');
649 background-repeat: no-repeat;
650 background-position: center;
651 }
652
653 .jqx-input-button-content-light {
654 font-size: 10px;
655 }
656 .jqx-widget .jqx-grid-cell, .jqx-widget .jqx-grid-column-header, .jqx-widget .jqx-grid-group-cell {border-color: #ddd;}
657 .jqx-combobox-content-light, .jqx-input-light {
658 border-color: #ddd;
659 color: #555555;
660 background-color: #ffffff;
661 -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
662 -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
663 }
664
665 .jqx-combobox-content-light, .jqx-combobox-light, .jqx-combobox-state-normal-light {
666 border-color: #ddd;
667 }
668
669 .jqx-combobox-content-focus-light, .jqx-combobox-state-focus-light, .jqx-fill-state-focus-light,
670 .jqx-numberinput-focus-light {
671 outline: none;
672 border-color: #959595;
673 }
674
675
676 input[type="text"].jqx-input-light, input[type="password"].jqx-input-light, input[type="text"].jqx-widget-content-light, input[type="textarea"].jqx-widget-content-light, textarea.jqx-input-light {
677 font-size: 14px;
678 padding: 0px;
679 padding-left:3px;
680 padding-right: 3px;
681 resize: none;
682 }
683
684 input[type="text"].jqx-input-light:-moz-placeholder, input[type="text"].jqx-widget-content-light:-moz-placeholder, input[type="textarea"].jqx-widget-content-light:-moz-placeholder, textarea.jqx-input-light:-moz-placeholder {
685 color: #999999;
686 }
687
688 input[type="text"].jqx-input-light:-webkit-input-placeholder, input[type="text"].jqx-widget-content-light:-webkit-input-placeholder, input[type="textarea"].jqx-widget-content-light:-webkit-input-placeholder, textarea.jqx-input-light:-webkit-input-placeholder {
689 color: #999999;
690 }
691
692 input[type="text"].jqx-input-light:-ms-input-placeholder, input[type="text"].jqx-widget-content-light:-ms-input-placeholder, input[type="textarea"].jqx-widget-content-light:-ms-input-placeholder, textarea.jqx-input-light:-ms-input-placeholder {
693 color: #999999;
694 }
695
696 .jqx-combobox-content-light, .jqx-input-light {
697 border-color: #ddd;
698 color: #555555;
699 background-color: #ffffff;
700 }
701
702 .jqx-combobox-content-light, .jqx-combobox-light, .jqx-combobox-state-normal-light {
703 border-color: #ddd;
704 }
705
706 .jqx-combobox-content-focus-light, .jqx-combobox-state-focus-light, .jqx-fill-state-focus-light,
707 .jqx-numberinput-focus-light {
708 outline: none;
709 border-color: #1ca8dd;
710 }
711 .jqx-popup-light.jqx-fill-state-focus-light
712 {
713 outline: none;
714 border-color: #ddd !important;
715 }
716
717 .jqx-datetimeinput-content, .jqx-datetimeinput-container {
718 overflow: visible !important;
719 }
720
721
722 .jqx-slider-rangebar-light {
723 border-color: #1ca8dd;
724 background: #1ca8dd;
725 }
726
727 .jqx-grid-cell-light.jqx-grid-cell-selected-light>.jqx-grid-group-expand-light {
728 background-image: url('images/metro-icon-down-white.png');
729 background-repeat: no-repeat;
730 background-position: center;
731 }
732 .jqx-grid-cell-light.jqx-grid-cell-selected-light>.jqx-grid-group-collapse-light{
733 background-image: url('images/metro-icon-right-white.png');
734 background-repeat: no-repeat;
735 background-position: center;
736 }
737 .jqx-grid-cell-light.jqx-grid-cell-selected-light>.jqx-grid-group-collapse-rtl-light{
738 background-image: url('images/metro-icon-left-white.png');
739 background-repeat: no-repeat;
740 background-position: center;
741 }
742 .jqx-grid-cell-light.jqx-grid-cell-selected-light>.jqx-grid-group-expand-rtl-light {
743 background-image: url('images/metro-icon-down-white.png');
744 background-repeat: no-repeat;
745 background-position: center;
746 }
747 .jqx-tabs-title-selected-top-light, .jqx-tabs-selection-tracker-top-light {
748 border-color: #ddd;
749 border-bottom: 1px solid #fff;
750 filter: none;
751 background: #fff;
752 color: #333 !important;
753 -webkit-box-shadow: none;
754 -moz-box-shadow: none;
755 box-shadow: none;
756 }
757
758 .jqx-tabs-title-selected-bottom-light, .jqx-tabs-selection-tracker-bottom-light {
759 border-color: #ddd;
760 border-top: 1px solid #fff;
761 filter: none;
762 background: #fff;
763 -webkit-box-shadow: none;
764 -moz-box-shadow: none;
765 box-shadow: none;
766 }
767 .jqx-tabs-title-hover-top-light, .jqx-tabs-title-hover-bottom-light, .jqx-tabs-header-light
768 {
769 -webkit-box-shadow: none !important;
770 -moz-box-shadow: none !important; 1961 -moz-box-shadow: none !important;
771 box-shadow: none !important; 1962 box-shadow: none !important;
772 } 1963 background: var(--jqx-surface);
773 .jqx-window-collapse-button-light 1964 color: var(--jqx-surface-color);
1965 }
1966
1967 .jqx-tabs-content-light {
1968 box-sizing: border-box;
1969 border: 1px solid var(--jqx-border);
1970 border-top-color: transparent;
1971 padding:5px;
1972 }
1973 .jqx-tabs-bar-light {
1974 position: absolute;
1975 bottom: 0;
1976 background: var(--jqx-primary);
1977 height: 2px;
1978 z-index:10;
1979 transition: .5s cubic-bezier(.35,0,.25,1);
1980 }
1981 .jqx-tabs-bar-light.vertical {
1982 width: 2px;
1983 }
1984 .jqx-tabs-position-bottom .jqx-tabs-bar-light {
1985 top: 0;
1986 }
1987
1988
1989 .jqx-layout-light {
1990 background-color: var(--jqx-background);
1991 }
1992
1993 .jqx-kanban-column-header-collapsed-light {
1994 background: var(--jqx-surface);
1995 color: var(--jqx-surface-color);
1996 }
1997
1998 .jqx-calendar-cell-light {
1999 border-radius: 0px;
2000 font-size:12px;
2001 }
2002 .jqx-calendar-cell-light.jqx-fill-state-pressed-light {
2003 outline: 2px var(--jqx-primary);
2004 overflow: hidden;
2005 position: relative;
2006 }
2007 .jqx-calendar-cell-light.jqx-fill-state-pressed-light:after {
2008 content: '';
2009 width: calc(100% - 4px);
2010 position: absolute;
2011 left: 0px;
2012 top: 0px;
2013 height: calc(100% - 4px);
2014 border: 2px solid var(--jqx-background);
2015 }
2016 .jqx-calendar-cell-year-light,
2017 .jqx-calendar-cell-decade-light {
2018 border-radius: 0px;
2019 }
2020 .jqx-calendar-title-content-light {
2021 font-weight:bold;
2022 }
2023 .jqx-calendar-column-cell-light {
2024 color: var(--jqx-background-color);
2025 font-size:12px;
2026 }
2027
2028 .jqx-icon-time-light,
2029 .jqx-icon-time-hover-light,
2030 .jqx-icon-time-pressed-light {
2031 background-image: none !important;
2032 font-family: 'jqx-icons';
2033 display: flex;
2034 font-family: 'jqx-icons';
2035 font-size: 16px;
2036 align-content: center;
2037 justify-content: center;
2038 left: initial !important;
2039 margin-top: 0px;
2040 top: 0px;
2041 left: 0px;
2042 margin: 0;
2043 align-items: center;
2044 width: 100%;
2045 height: 100%;
2046 }
2047
2048 .jqx-icon-time-light:after,
2049 .jqx-icon-time-hover-light:after,
2050 .jqx-icon-time-pressed-light:after {
2051 content: var(--jqx-icon-arrow-down);
2052 }
2053
2054 .jqx-icon-calendar-light,
2055 .jqx-icon-calendar-hover-light,
2056 .jqx-icon-calendar-pressed-light {
2057 background-image: none !important;
2058 font-family: 'jqx-icons';
2059 left: 0;
2060 top: 0 !important;
2061 margin: 0 !important;
2062 display: flex;
2063 justify-content: center;
2064 align-items: center;
2065 width: 100% !important;
2066 height: 100% !important;
2067 }
2068 .jqx-icon-calendar-light:after,
2069 .jqx-icon-calendar-hover-light:after,
2070 .jqx-icon-calendar-pressed-light:after {
2071 content: var(--jqx-icon-calendar);
2072 }
2073
2074 .jqx-tabs-close-button-light,
2075 .jqx-tabs-close-button-selected-light,
2076 .jqx-tabs-close-button-hover-light {
2077 background-image: none;
2078 }
2079
2080 .jqx-tabs-close-button-light:after {
2081 content: var(--jqx-icon-close);
2082 }
2083
2084 .jqx-scrollbar-button-state-pressed-light .jqx-icon-arrow-up-selected-light {
2085 background-image: none;
2086 }
2087
2088 .jqx-scrollbar-button-state-pressed-light .jqx-icon-arrow-down-selected-light {
2089 background-image: none;
2090 }
2091
2092 .jqx-scrollbar-button-state-pressed-light .jqx-icon-arrow-left-selected-light {
2093 background-image: none;
2094 }
2095
2096 .jqx-scrollbar-button-state-pressed-light .jqx-icon-arrow-right-selected-light {
2097 background-image: none;
2098 }
2099
2100 .jqx-grid-cell-light.jqx-grid-cell-selected-light > .jqx-grid-group-expand-light {
2101 background-image: none;
2102 }
2103
2104 .jqx-grid-cell-light.jqx-grid-cell-selected-light > .jqx-grid-group-collapse-light {
2105 background-image: none;
2106 }
2107
2108 .jqx-grid-cell-light.jqx-grid-cell-selected-light > .jqx-grid-group-collapse-rtl-light {
2109 background-image: none;
2110 }
2111
2112 .jqx-grid-cell-light.jqx-grid-cell-selected-light > .jqx-grid-group-expand-rtl-light {
2113 background-image: none;
2114 }
2115
2116 .jqx-grid-group-collapse-light {
2117 background-image: none;
2118 }
2119
2120 .jqx-grid-group-collapse-rtl-light {
2121 background-image: none;
2122 }
2123
2124 .jqx-grid-group-expand-light, .jqx-grid-group-expand-rtl-light {
2125 background-image: none;
2126 }
2127
2128 .jqx-icon-arrow-first-light,
2129 .jqx-icon-arrow-last-light {
2130 background-image: none;
2131 font-family: jqx-icons;
2132 }
2133 .jqx-icon-arrow-first-light:after {
2134 content: var(--jqx-icon-first-page);
2135 }
2136 .jqx-icon-arrow-last-light:after {
2137 content: var(--jqx-icon-last-page);
2138 }
2139
2140 /* Ripple effect */
2141 .ripple {
2142 position: relative;
2143 transform: translate3d(0, 0, 0);
2144 overflow:hidden;
2145 }
2146
2147 .ink {
2148 display: block;
2149 position: absolute;
2150 pointer-events: none;
2151 border-radius: 0%;
2152 transform: scaleX(0);
2153 background: rgba(var(--jqx-primary-rgb),0.5);
2154 opacity: 0.25;
2155 }
2156
2157 .jqx-scrollbar-light .jqx-icon-arrow-up,
2158 .jqx-scrollbar-light .jqx-icon-arrow-down,
2159 .jqx-scrollbar-light .jqx-icon-arrow-right,
2160 .jqx-scrollbar-light .jqx-icon-arrow-left {
2161 display: flex;
2162 justify-content: center;
2163 align-items: center;
2164 }
2165
2166 .outlined .ink, .flat .ink {
2167 background: rgba(var(--jqx-primary-rgb),0.5);
2168 overflow:hidden;
2169 }
2170
2171 .ink.animate {
2172 animation: ripple .7s ease;
2173 animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
2174 }
2175
2176 .jqx-tree-light .jqx-checkbox-light {
2177 margin-top: 6px !important;
2178 border-radius: 0px !important;
2179 }
2180 .jqx-tree-item-arrow-expand-light,
2181 .jqx-tree-item-arrow-collapse-light {
2182 margin-top: 6px !important;
2183 }
2184
2185 .jqx-checkbox-light .ripple,
2186 .jqx-radiobutton-light .ripple
2187 {
2188 overflow:visible;
2189 }
2190 .jqx-checkbox-light .ink,
2191 .jqx-radiobutton-light .ink
2192 {
2193 transform: scale(0);
2194 background: var(--jqx-primary);
2195 border-radius: 50%;
2196 }
2197 .jqx-checkbox-light .ink.animate,
2198 .jqx-radiobutton-light .ink.animate
2199 {
2200 animation: checkRipple 0.3s ease;
2201 animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
2202 }
2203 .jqx-checkbox-light .ink.active,
2204 .jqx-radiobutton-light .ink.active
2205 {
2206 opacity: 0.2;
2207 transform: scale(2);
2208 }
2209 .jqx-checkbox-default-light.active .ink,
2210 .jqx-radiobutton-default-light.active .ink
2211 {
2212 opacity: 0.2;
2213 transform: scale(2);
2214 }
2215
2216 /* Ripple effect */
2217 /* Ripple effect */
2218 .buttonRipple {
2219 background-position: center;
2220 transition: background 0.8s;
2221 }
2222 .buttonRipple.jqx-button-light.jqx-fill-state-hover {
2223 color: var(--jqx-background-color-hover);
2224 background: var(--jqx-background-hover) radial-gradient(circle, transparent 1%, var(--jqx-background-hover) 1%) center/15000%;
2225 }
2226 .buttonRipple.jqx-button-light.jqx-fill-state-pressed {
2227 color: var(--jqx-background-color-hover);
2228 background-color: rgba(var(--jqx-background-hover-rgb), 0.5);
2229 background-size: 100%;
2230 transition: background 0s;
2231 }
2232 .buttonRipple.jqx-button-light.jqx-fill-state-hover.primary {
2233 color: var(--jqx-primary-color);
2234 background: var(--jqx-primary) radial-gradient(circle, transparent 1%, var(--jqx-primary) 1%) center/15000%;
2235 }
2236 .buttonRipple.jqx-button-light.jqx-fill-state-pressed.primary {
2237 color: var(--jqx-primary-color);
2238 background-color: rgba(var(--jqx-primary-rgb), 0.8);
2239 background-size: 100%;
2240 transition: background 0s;
2241 }
2242
2243 @keyframes ripple {
2244 100% {
2245 opacity: 0;
2246 transform: scale(5);
2247 animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
2248 }
2249 }
2250 @keyframes checkRipple {
2251 100% {
2252 opacity: 0.2;
2253 transform: scale(2);
2254 animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
2255 }
2256 }
2257
2258 .jqx-fill-state-pressed-light .jqx-icon-delete-light
774 { 2259 {
775 margin-top: 0px; 2260 background-image: url('images/icon-delete-white.png');
776 } 2261 }
777 .jqx-window-collapse-button-collapsed-light { 2262 .jqx-fill-state-pressed-light .jqx-icon-edit-light
778 margin-top: 0px;
779 }
780 .jqx-layout-light
781 { 2263 {
782 background-color: #cccccc; 2264 background-image: url('images/icon-edit-white.png');
783 } 2265 }
784 .jqx-kanban-column-header-collapsed-light { 2266 .jqx-fill-state-pressed-light .jqx-icon-save-light
785 background: -moz-linear-gradient(0deg, rgba(248,248,248,1) 0%, rgba(234,234,234,1) 100%); /* ff3.6+ */
786 background: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(248,248,248,1)), color-stop(100%, rgba(234,234,234,1))); /* safari4+,chrome */
787 background: -webkit-linear-gradient(0deg, rgba(248,248,248,1) 0%, rgba(234,234,234,1) 100%); /* safari5.1+,chrome10+ */
788 background: -o-linear-gradient(0deg, rgba(248,248,248,1) 0%, rgba(234,234,234,1) 100%); /* opera 11.10+ */
789 background: -ms-linear-gradient(0deg, rgba(248,248,248,1) 0%, rgba(234,234,234,1) 100%); /* ie10+ */
790 background: linear-gradient(90deg, rgba(248,248,248,1) 0%, rgba(234,234,234,1) 100%); /* w3c */
791 }
792
793 .jqx-calendar-light td {
794 font-size: 14px;
795 }
796 .jqx-grid-column-menubutton-light {
797 background-image: url('images/metro-icon-down.png');
798 }
799
800 .jqx-menu-item-arrow-up-selected-light, .jqx-icon-arrow-up-selected-light{background-image:url('images/metro-icon-up-white.png');background-repeat:no-repeat;background-position:center;}
801 .jqx-menu-item-arrow-down-selected-light, .jqx-icon-arrow-down-selected-light{background-image:url('images/metro-icon-down-white.png');background-repeat:no-repeat;background-position:center;}
802 .jqx-menu-item-arrow-left-selected-light, .jqx-icon-arrow-left-selected-light{background-image:url('images/metro-icon-left-white.png');background-repeat:no-repeat;background-position:center;}
803 .jqx-menu-item-arrow-right-selected-light, .jqx-icon-arrow-right-selected-light{background-image:url('images/metro-icon-right-white.png');background-repeat:no-repeat;background-position:center;}
804 .jqx-tabs-close-button-light{background-image:url(images/close.png); background-repeat:no-repeat; background-position:center;}
805 .jqx-tabs-close-button-selected-light{background-image:url(images/close.png); background-repeat:no-repeat; background-position:center;}
806 .jqx-tabs-close-button-hover-light{background-image:url(images/close.png); background-repeat:no-repeat; background-position:center;}
807 .jqx-scrollbar-button-state-pressed-light .jqx-icon-arrow-up-selected-light{background-image:url('images/metro-icon-up.png');background-repeat:no-repeat;background-position:center;}
808 .jqx-scrollbar-button-state-pressed-light .jqx-icon-arrow-down-selected-light{background-image:url('images/metro-icon-down.png');background-repeat:no-repeat;background-position:center;}
809 .jqx-scrollbar-button-state-pressed-light .jqx-icon-arrow-left-selected-light{background-image:url('images/metro-icon-left.png');background-repeat:no-repeat;background-position:center;}
810 .jqx-scrollbar-button-state-pressed-light .jqx-icon-arrow-right-selected-light{background-image:url('images/metro-icon-right.png');background-repeat:no-repeat;background-position:center;}
811
812 .jqx-grid-cell-light.jqx-grid-cell-selected-light>.jqx-grid-group-expand-light {
813 background-image: url('images/metro-icon-down-white.png');
814 background-repeat: no-repeat;
815 background-position: center;
816 }
817 .jqx-grid-cell-light.jqx-grid-cell-selected-light>.jqx-grid-group-collapse-light{
818 background-image: url('images/metro-icon-right-white.png');
819 background-repeat: no-repeat;
820 background-position: center;
821 }
822 .jqx-grid-cell-light.jqx-grid-cell-selected-light>.jqx-grid-group-collapse-rtl-light {
823 background-image: url('images/metro-icon-left-white.png');
824 background-repeat: no-repeat;
825 background-position: center;
826 }
827 .jqx-grid-cell-light.jqx-grid-cell-selected-light>.jqx-grid-group-expand-rtl-light{
828 background-image: url('images/metro-icon-down-white.png');
829 background-repeat: no-repeat;
830 background-position: center;
831 }
832 .jqx-grid-group-collapse-light {
833 background-image: url(images/metro-icon-right.png);
834 background-position: 50% 50%;
835 background-repeat: no-repeat;
836 }
837 .jqx-grid-group-collapse-rtl-light
838 { 2267 {
839 padding-right: 0px; 2268 background-image: url('images/icon-save-white.png');
840 background-image: url(images/metro-icon-left.png); 2269 }
841 background-position: 50% 50%; 2270 .jqx-fill-state-pressed-light .jqx-icon-cancel-light
842 background-repeat: no-repeat;
843 }
844 .jqx-grid-group-expand-light, .jqx-grid-group-expand-rtl-light
845 { 2271 {
846 padding-right: 0px; 2272 background-image: url('images/icon-cancel-white.png');
847 background-image: url(images/metro-icon-down.png); 2273 }
848 background-position: 50% 50%; 2274 .jqx-fill-state-pressed-light .jqx-icon-search-light
849 background-repeat: no-repeat;
850 }
851 .jqx-icon-arrow-first-light
852 { 2275 {
853 background-image: url('images/metro-icon-first.png'); 2276 background-image: url('images/search_white.png');
854 background-repeat: no-repeat; 2277 }
855 background-position: center; 2278 .jqx-fill-state-pressed-light .jqx-icon-plus-light
856 }
857 .jqx-icon-arrow-last-light
858 { 2279 {
859 background-image: url('images/metro-icon-last.png'); 2280 background-image: url('images/plus_white.png');
860 background-repeat: no-repeat; 2281 }
861 background-position: center; 2282 .jqx-menu-minimized-button-light {
862 } 2283 padding: 0px !important;
863 .jqx-icon-arrow-first-hover-light 2284 }
2285 .jqx-fill-state-pressed-light .jqx-menu-minimized-button-light {
2286 background-image: url('images/icon-menu-minimized-white.png');
2287 }
2288
2289
2290 .jqx-editor-toolbar-icon-light {
2291 background: url('images/html_editor.png') no-repeat;
2292 }
2293
2294 .jqx-fill-state-hover-light .jqx-editor-toolbar-icon-fontsize-light,
2295 .jqx-fill-state-pressed-light .jqx-editor-toolbar-icon-fontsize-light,
2296 .jqx-fill-state-hover-light .jqx-editor-toolbar-icon-forecolor-light,
2297 .jqx-fill-state-pressed-light .jqx-editor-toolbar-icon-forecolor-light
864 { 2298 {
865 background-image: url('images/metro-icon-first.png'); 2299 background: url('images/html_editor.png') no-repeat;
866 background-repeat: no-repeat; 2300 }
867 background-position: center; 2301
868 } 2302 .jqx-editor-toolbar-button-light{
869 .jqx-icon-arrow-last-hover-light 2303 border-color: var(--jqx-border);
870 { 2304 box-shadow: none !important;
871 background-image: url('images/metro-icon-last.png'); 2305 color: var(--jqx-background-color);
872 background-repeat: no-repeat; 2306 }
873 background-position: center; 2307
874 } 2308 .jqx-time-picker .jqx-main-container {
875 .jqx-icon-arrow-first-selected-light 2309 background: var(--jqx-background);
876 { 2310 }
877 background-image: url('images/metro-icon-first-white.png'); 2311
878 background-repeat: no-repeat; 2312 /*applied to the timepicker*/
879 background-position: center; 2313 .jqx-needle-central-circle-light {
880 } 2314 fill: var(--jqx-primary);
881 .jqx-icon-arrow-last-selected-light 2315 }
882 { 2316 .jqx-time-picker-light .jqx-label-light {
883 background-image: url('images/metro-icon-last-white.png'); 2317 fill: var(--jqx-background-color);
884 background-repeat: no-repeat; 2318 }
885 background-position: center; 2319 .jqx-needle-light {
886 } 2320 fill: var(--jqx-primary);
887 .jqx-tree-grid-collapse-button-light { 2321 }
888 margin-top: 1px; 2322 .jqx-time-picker .jqx-header .jqx-selected-light:focus {
889 } 2323 outline: 2px solid var(--jqx-primary);
890 .jqx-icon-calendar-pressed-light { 2324 box-shadow: 0px 0px 4px 2px rgba(0, 119, 190, 0.125);
891 background-image: url('images/icon-calendar-white.png'); 2325 }
892 } 2326 .jqx-svg-picker-light:focus {
893 .jqx-icon-time-pressed-light { 2327 border: 1px solid var(--jqx-primary) !important;
894 background-image: url('images/icon-time-white.png'); 2328 }
895 } 2329 .jqx-validator-hint-light {
896 2330 background: #D94F43;
897 .jqx-primary .jqx-icon-arrow-down-light, .jqx-warning .jqx-icon-arrow-down-light, .jqx-danger .jqx-icon-arrow-down-light, .jqx-success .jqx-icon-arrow-down-light, .jqx-info .jqx-icon-arrow-down-light { 2331 border-color: #D94F43;
898 background-image: url('images/metro-icon-down-white.png'); 2332 padding: 10px;
899 } 2333 }
900 .jqx-primary .jqx-icon-arrow-down-selected-light, .jqx-warning .jqx-icon-arrow-down-selected-light, .jqx-danger .jqx-icon-arrow-down-selected-light, .jqx-success .jqx-icon-arrow-down-selected-light, .jqx-info .jqx-icon-arrow-down-selected-light { 2334 .jqx-validator-hint-light img {
901 background-image: url('images/metro-icon-down-white.png'); 2335 display: none;
902 } 2336 }
903 .jqx-primary .jqx-icon-arrow-down-hover-light, .jqx-warning .jqx-icon-arrow-down-hover-light, .jqx-danger .jqx-icon-arrow-down-hover-light, .jqx-success .jqx-icon-arrow-down-hover-light, .jqx-info .jqx-icon-arrow-down-hover-light { 2337
904 background-image: url('images/metro-icon-down-white.png'); 2338
905 } 2339 .jqx-grid-group-expand-light:after,
906 .jqx-primary .jqx-icon-arrow-up-light, .jqx-warning .jqx-icon-arrow-up-light, .jqx-danger .jqx-icon-arrow-up-light, .jqx-success .jqx-icon-arrow-up-light, .jqx-info .jqx-icon-arrow-up-light { 2340 .jqx-grid-group-collapse-light:after {
907 background-image: url('images/metro-icon-up-white.png'); 2341 display: flex;
908 } 2342 justify-content: center;
909 .jqx-primary .jqx-icon-arrow-up-selected-light, .jqx-warning .jqx-icon-arrow-up-selected-light, .jqx-danger .jqx-icon-arrow-up-selected-light, .jqx-success .jqx-icon-arrow-up-selected-light, .jqx-info .jqx-icon-arrow-up-selected-light { 2343 align-content: center;
910 background-image: url('images/metro-icon-up-white.png'); 2344 align-items: center;
911 } 2345 height: 100%;
912 .jqx-primary .jqx-icon-arrow-up-hover-light, .jqx-warning .jqx-icon-arrow-up-hover-light, .jqx-danger .jqx-icon-arrow-up-hover-light, .jqx-success .jqx-icon-arrow-up-hover-light, .jqx-info .jqx-icon-arrow-up-hover-light { 2346 }
913 background-image: url('images/metro-icon-up-white.png');
914 }
915
916
917 .jqx-primary .jqx-icon-arrow-left-light, .jqx-warning .jqx-icon-arrow-left-light, .jqx-danger .jqx-icon-arrow-left-light, .jqx-success .jqx-icon-arrow-left-light, .jqx-info .jqx-icon-arrow-left-light {
918 background-image: url('images/metro-icon-left-white.png');
919 }
920 .jqx-primary .jqx-icon-arrow-left-selected-light, .jqx-warning .jqx-icon-arrow-left-selected-light, .jqx-danger .jqx-icon-arrow-left-selected-light, .jqx-success .jqx-icon-arrow-left-selected-light, .jqx-info .jqx-icon-arrow-left-selected-light {
921 background-image: url('images/metro-icon-left-white.png');
922 }
923 .jqx-primary .jqx-icon-arrow-left-hover-light, .jqx-warning .jqx-icon-arrow-left-hover-light, .jqx-danger .jqx-icon-arrow-left-hover-light, .jqx-success .jqx-icon-arrow-left-hover-light, .jqx-info .jqx-icon-arrow-left-hover-light {
924 background-image: url('images/metro-icon-left-white.png');
925 }
926 .jqx-primary .jqx-icon-arrow-right-light, .jqx-warning .jqx-icon-arrow-right-light, .jqx-danger .jqx-icon-arrow-right-light, .jqx-success .jqx-icon-arrow-right-light, .jqx-info .jqx-icon-arrow-right-light {
927 background-image: url('images/metro-icon-right-white.png');
928 }
929 .jqx-primary .jqx-icon-arrow-right-selected-light, .jqx-warning .jqx-icon-arrow-right-selected-light, .jqx-danger .jqx-icon-arrow-right-selected-light, .jqx-success .jqx-icon-arrow-right-selected-light, .jqx-info .jqx-icon-arrow-right-selected-light {
930 background-image: url('images/metro-icon-right-white.png');
931 }
932 .jqx-primary .jqx-icon-arrow-right-hover-light, .jqx-warning .jqx-icon-arrow-right-hover-light, .jqx-danger .jqx-icon-arrow-right-hover-light, .jqx-success .jqx-icon-arrow-right-hover-light, .jqx-info .jqx-icon-arrow-right-hover-light {
933 background-image: url('images/metro-icon-right-white.png');
934 }

mercurial