| 1 |
|
| 2 | .next-sr-only {
|
| 3 | position: absolute;
|
| 4 | width: 1px;
|
| 5 | height: 1px;
|
| 6 | padding: 0;
|
| 7 | overflow: hidden;
|
| 8 | clip: rect(0, 0, 0, 0);
|
| 9 | white-space: nowrap;
|
| 10 | border: 0;
|
| 11 | top: 0;
|
| 12 | margin: -1px; }
|
| 13 |
|
| 14 | .next-input {
|
| 15 | box-sizing: border-box;
|
| 16 | vertical-align: middle;
|
| 17 | display: inline-table;
|
| 18 | border-collapse: separate;
|
| 19 | font-size: 0;
|
| 20 | line-height: 1;
|
| 21 | width: 200px;
|
| 22 | border-spacing: 0;
|
| 23 | transition: all 100ms linear;
|
| 24 | transition: all var(--motion-duration-immediately, 100ms) var(--motion-linear, linear);
|
| 25 | border: 1px solid #C4C6CF;
|
| 26 | border: var(--input-border-width, 1px) solid var(--input-border-color, #C4C6CF);
|
| 27 | background-color: #FFFFFF;
|
| 28 | background-color: var(--input-bg-color, #FFFFFF); }
|
| 29 | .next-input *,
|
| 30 | .next-input *:before,
|
| 31 | .next-input *:after {
|
| 32 | box-sizing: border-box; }
|
| 33 | .next-input input {
|
| 34 | height: 100%;
|
| 35 | }
|
| 36 | .next-input input[type="reset"], .next-input input[type="submit"] {
|
| 37 | -webkit-appearance: button;
|
| 38 | cursor: pointer; }
|
| 39 | .next-input input::-moz-focus-inner {
|
| 40 | border: 0;
|
| 41 | padding: 0; }
|
| 42 | .next-input input:-webkit-autofill {
|
| 43 | -webkit-box-shadow: 0 0 0 1000px #FFFFFF inset;
|
| 44 | -webkit-box-shadow: 0 0 0 1000px var(--input-bg-color, #FFFFFF) inset;
|
| 45 | border-radius: 3px;
|
| 46 | border-radius: var(--form-element-large-corner, 3px); }
|
| 47 | .next-input input[type="password"]::-ms-reveal {
|
| 48 | display: none; }
|
| 49 | .next-input textarea {
|
| 50 | resize: none; }
|
| 51 | .next-input input,
|
| 52 | .next-input textarea {
|
| 53 | width: 100%;
|
| 54 | border: none;
|
| 55 | outline: none;
|
| 56 | padding: 0;
|
| 57 | margin: 0;
|
| 58 | font-weight: normal;
|
| 59 | vertical-align: middle;
|
| 60 | background-color: transparent;
|
| 61 | color: #333333;
|
| 62 | color: var(--input-text-color, #333333); }
|
| 63 | .next-input input::-ms-clear,
|
| 64 | .next-input textarea::-ms-clear {
|
| 65 | display: none; }
|
| 66 | .next-input.next-small {
|
| 67 | height: 20px;
|
| 68 | height: var(--form-element-small-height, 20px);
|
| 69 | border-radius: 3px;
|
| 70 | border-radius: var(--form-element-small-corner, 3px); }
|
| 71 | .next-input.next-small .next-input-label {
|
| 72 | padding-left: 8px;
|
| 73 | padding-left: var(--input-s-label-padding-left, 8px);
|
| 74 | font-size: 12px;
|
| 75 | font-size: var(--form-element-small-font-size, 12px); }
|
| 76 | .next-input.next-small .next-input-inner {
|
| 77 | font-size: 12px;
|
| 78 | font-size: var(--form-element-small-font-size, 12px); }
|
| 79 | .next-input.next-small .next-input-control {
|
| 80 | padding-right: 4px;
|
| 81 | padding-right: var(--input-s-icon-padding-right, 4px); }
|
| 82 | .next-input.next-small .next-input-inner-text {
|
| 83 | padding-right: 4px;
|
| 84 | padding-right: var(--input-s-icon-padding-right, 4px); }
|
| 85 | .next-input.next-small input {
|
| 86 | height: 18px;
|
| 87 | height: calc(var(--form-element-small-height, 20px) - var(--input-border-width, 1px)*2);
|
| 88 | line-height: 18px \0;
|
| 89 | line-height: calc(var(--form-element-small-height, 20px) - var(--input-border-width, 1px)*2) \0;
|
| 90 | padding: 0 4px;
|
| 91 | padding: 0 var(--input-s-padding, 4px);
|
| 92 | font-size: 12px;
|
| 93 | font-size: var(--form-element-small-font-size, 12px); }
|
| 94 | .next-input.next-small input::placeholder {
|
| 95 | font-size: 12px;
|
| 96 | font-size: var(--form-element-small-font-size, 12px); }
|
| 97 | .next-input.next-small .next-input-text-field {
|
| 98 | padding: 0 4px;
|
| 99 | padding: 0 var(--input-s-padding, 4px);
|
| 100 | font-size: 12px;
|
| 101 | font-size: var(--form-element-small-font-size, 12px);
|
| 102 | height: 18px;
|
| 103 | height: calc(var(--form-element-small-height, 20px) - var(--input-border-width, 1px)*2);
|
| 104 | line-height: 18px;
|
| 105 | line-height: calc(var(--form-element-small-height, 20px) - var(--input-border-width, 1px)*2); }
|
| 106 | .next-input.next-small .next-icon:before,
|
| 107 | .next-input.next-small .next-icon .next-icon-remote {
|
| 108 | width: 12px;
|
| 109 | width: var(--form-element-small-icon-size, 12px);
|
| 110 | font-size: 12px;
|
| 111 | font-size: var(--form-element-small-icon-size, 12px);
|
| 112 | line-height: inherit; }
|
| 113 | .next-input.next-small .next-input-control {
|
| 114 | border-radius: 0 3px 3px 0;
|
| 115 | border-radius: 0 var(--form-element-small-corner, 3px) var(--form-element-small-corner, 3px) 0; }
|
| 116 | .next-input.next-medium {
|
| 117 | height: 28px;
|
| 118 | height: var(--form-element-medium-height, 28px);
|
| 119 | border-radius: 3px;
|
| 120 | border-radius: var(--form-element-medium-corner, 3px); }
|
| 121 | .next-input.next-medium .next-input-label {
|
| 122 | padding-left: 8px;
|
| 123 | padding-left: var(--input-m-label-padding-left, 8px);
|
| 124 | font-size: 12px;
|
| 125 | font-size: var(--form-element-medium-font-size, 12px); }
|
| 126 | .next-input.next-medium .next-input-inner {
|
| 127 | font-size: 12px;
|
| 128 | font-size: var(--form-element-medium-font-size, 12px); }
|
| 129 | .next-input.next-medium .next-input-control {
|
| 130 | padding-right: 8px;
|
| 131 | padding-right: var(--input-m-icon-padding-right, 8px); }
|
| 132 | .next-input.next-medium .next-input-inner-text {
|
| 133 | padding-right: 8px;
|
| 134 | padding-right: var(--input-m-icon-padding-right, 8px); }
|
| 135 | .next-input.next-medium input {
|
| 136 | height: 26px;
|
| 137 | height: calc(var(--form-element-medium-height, 28px) - var(--input-border-width, 1px)*2);
|
| 138 | line-height: 26px \0;
|
| 139 | line-height: calc(var(--form-element-medium-height, 28px) - var(--input-border-width, 1px)*2) \0;
|
| 140 | padding: 0 8px;
|
| 141 | padding: 0 var(--input-m-padding, 8px);
|
| 142 | font-size: 12px;
|
| 143 | font-size: var(--form-element-medium-font-size, 12px); }
|
| 144 | .next-input.next-medium input::placeholder {
|
| 145 | font-size: 12px;
|
| 146 | font-size: var(--form-element-medium-font-size, 12px); }
|
| 147 | .next-input.next-medium .next-input-text-field {
|
| 148 | padding: 0 8px;
|
| 149 | padding: 0 var(--input-m-padding, 8px);
|
| 150 | font-size: 12px;
|
| 151 | font-size: var(--form-element-medium-font-size, 12px);
|
| 152 | height: 26px;
|
| 153 | height: calc(var(--form-element-medium-height, 28px) - var(--input-border-width, 1px)*2);
|
| 154 | line-height: 26px;
|
| 155 | line-height: calc(var(--form-element-medium-height, 28px) - var(--input-border-width, 1px)*2); }
|
| 156 | .next-input.next-medium .next-icon:before,
|
| 157 | .next-input.next-medium .next-icon .next-icon-remote {
|
| 158 | width: 12px;
|
| 159 | width: var(--form-element-medium-icon-size, 12px);
|
| 160 | font-size: 12px;
|
| 161 | font-size: var(--form-element-medium-icon-size, 12px);
|
| 162 | line-height: inherit; }
|
| 163 | .next-input.next-medium .next-input-control {
|
| 164 | border-radius: 0 3px 3px 0;
|
| 165 | border-radius: 0 var(--form-element-medium-corner, 3px) var(--form-element-medium-corner, 3px) 0; }
|
| 166 | .next-input.next-large {
|
| 167 | height: 40px;
|
| 168 | height: var(--form-element-large-height, 40px);
|
| 169 | border-radius: 3px;
|
| 170 | border-radius: var(--form-element-large-corner, 3px); }
|
| 171 | .next-input.next-large .next-input-label {
|
| 172 | padding-left: 12px;
|
| 173 | padding-left: var(--input-l-label-padding-left, 12px);
|
| 174 | font-size: 16px;
|
| 175 | font-size: var(--form-element-large-font-size, 16px); }
|
| 176 | .next-input.next-large .next-input-inner {
|
| 177 | font-size: 16px;
|
| 178 | font-size: var(--form-element-large-font-size, 16px); }
|
| 179 | .next-input.next-large .next-input-control {
|
| 180 | padding-right: 8px;
|
| 181 | padding-right: var(--input-l-icon-padding-right, 8px); }
|
| 182 | .next-input.next-large .next-input-inner-text {
|
| 183 | padding-right: 8px;
|
| 184 | padding-right: var(--input-l-icon-padding-right, 8px); }
|
| 185 | .next-input.next-large input {
|
| 186 | height: 38px;
|
| 187 | height: calc(var(--form-element-large-height, 40px) - var(--input-border-width, 1px)*2);
|
| 188 | line-height: 38px \0;
|
| 189 | line-height: calc(var(--form-element-large-height, 40px) - var(--input-border-width, 1px)*2) \0;
|
| 190 | padding: 0 12px;
|
| 191 | padding: 0 var(--input-l-padding, 12px);
|
| 192 | font-size: 16px;
|
| 193 | font-size: var(--form-element-large-font-size, 16px); }
|
| 194 | .next-input.next-large input::placeholder {
|
| 195 | font-size: 16px;
|
| 196 | font-size: var(--form-element-large-font-size, 16px); }
|
| 197 | .next-input.next-large .next-input-text-field {
|
| 198 | padding: 0 12px;
|
| 199 | padding: 0 var(--input-l-padding, 12px);
|
| 200 | font-size: 16px;
|
| 201 | font-size: var(--form-element-large-font-size, 16px);
|
| 202 | height: 38px;
|
| 203 | height: calc(var(--form-element-large-height, 40px) - var(--input-border-width, 1px)*2);
|
| 204 | line-height: 38px;
|
| 205 | line-height: calc(var(--form-element-large-height, 40px) - var(--input-border-width, 1px)*2); }
|
| 206 | .next-input.next-large .next-icon:before,
|
| 207 | .next-input.next-large .next-icon .next-icon-remote {
|
| 208 | width: 16px;
|
| 209 | width: var(--form-element-large-icon-size, 16px);
|
| 210 | font-size: 16px;
|
| 211 | font-size: var(--form-element-large-icon-size, 16px);
|
| 212 | line-height: inherit; }
|
| 213 | .next-input.next-large .next-input-control {
|
| 214 | border-radius: 0 3px 3px 0;
|
| 215 | border-radius: 0 var(--form-element-large-corner, 3px) var(--form-element-large-corner, 3px) 0; }
|
| 216 | .next-input.next-input-textarea {
|
| 217 | height: auto;
|
| 218 | border-radius: 3px;
|
| 219 | border-radius: var(--input-multiple-corner, 3px);
|
| 220 | font-size: 0; }
|
| 221 | .next-input.next-input-textarea textarea {
|
| 222 | color: #333333;
|
| 223 | color: var(--input-text-color, #333333);
|
| 224 | padding: 4px 8px;
|
| 225 | padding: var(--input-multiple-padding-tb, 4px) var(--input-multiple-padding-lr, 8px);
|
| 226 | font-size: 12px;
|
| 227 | font-size: var(--input-multiple-font-size, 12px);
|
| 228 | border-radius: 3px;
|
| 229 | border-radius: var(--input-multiple-corner, 3px); }
|
| 230 | .next-input.next-input-textarea.next-small textarea {
|
| 231 | font-size: 12px;
|
| 232 | font-size: var(--form-element-medium-font-size, 12px); }
|
| 233 | .next-input.next-input-textarea.next-large textarea {
|
| 234 | font-size: 16px;
|
| 235 | font-size: var(--form-element-large-font-size, 16px); }
|
| 236 | .next-input.next-input-textarea .next-input-control {
|
| 237 | display: block;
|
| 238 | width: auto;
|
| 239 | border-radius: 3px;
|
| 240 | border-radius: var(--input-multiple-corner, 3px); }
|
| 241 | .next-input.next-input-textarea .next-input-len {
|
| 242 | padding: 0 8px 4px;
|
| 243 | padding: 0 var(--input-l-icon-padding-right, 8px) 4px;
|
| 244 | display: block;
|
| 245 | text-align: right;
|
| 246 | width: auto; }
|
| 247 | .next-input-hint-wrap {
|
| 248 | color: #999999;
|
| 249 | color: var(--input-hint-color, #999999);
|
| 250 | position: relative; }
|
| 251 | .next-input-hint-wrap .next-input-clear {
|
| 252 | opacity: 0;
|
| 253 | z-index: 1;
|
| 254 | position: absolute; }
|
| 255 | .next-input-hint-wrap .next-input-hint {
|
| 256 | opacity: 1; }
|
| 257 | .next-input .next-input-clear-icon:hover, .next-input .next-icon-eye:hover, .next-input .next-icon-eye-close:hover {
|
| 258 | cursor: pointer;
|
| 259 | color: #666666;
|
| 260 | color: var(--input-hint-hover-color, #666666); }
|
| 261 | .next-input .next-input-hover-show {
|
| 262 | opacity: 0; }
|
| 263 | .next-input:hover, .next-input.next-focus {
|
| 264 | border-color: #A0A2AD;
|
| 265 | border-color: var(--input-hover-border-color, #A0A2AD);
|
| 266 | background-color: #FFFFFF;
|
| 267 | background-color: var(--input-hover-bg-color, #FFFFFF); }
|
| 268 | .next-input:hover .next-input-clear, .next-input.next-focus .next-input-clear {
|
| 269 | opacity: 1; }
|
| 270 | .next-input:hover .next-input-clear + .next-input-hint, .next-input.next-focus .next-input-clear + .next-input-hint {
|
| 271 | opacity: 0; }
|
| 272 | .next-input:hover .next-input-hover-show, .next-input.next-focus .next-input-hover-show {
|
| 273 | opacity: 1; }
|
| 274 | .next-input .next-input-clear:focus {
|
| 275 | opacity: 1; }
|
| 276 | .next-input .next-input-clear:focus + .next-input-hint {
|
| 277 | opacity: 0; }
|
| 278 | .next-input.next-focus {
|
| 279 | border-color: #5584FF;
|
| 280 | border-color: var(--input-focus-border-color, #5584FF);
|
| 281 | background-color: #FFFFFF;
|
| 282 | background-color: var(--input-focus-bg-color, #FFFFFF);
|
| 283 | box-shadow: 0 0 0 2px rgba(85, 132, 255, 0.2);
|
| 284 | box-shadow: 0 0 0 var(--input-focus-shadow-spread, 2px) var(--color-calculate-input-focus-shadow, rgba(85, 132, 255, 0.2)); }
|
| 285 | .next-input.next-warning {
|
| 286 | border-color: #FF9300;
|
| 287 | border-color: var(--input-feedback-warning-border-color, #FF9300);
|
| 288 | background-color: #FFFFFF;
|
| 289 | background-color: var(--input-feedback-warning-bg-color, #FFFFFF); }
|
| 290 | .next-input.next-warning.next-focus, .next-input.next-warning:hover {
|
| 291 | border-color: #FF9300;
|
| 292 | border-color: var(--input-feedback-warning-border-color, #FF9300); }
|
| 293 | .next-input.next-warning.next-focus {
|
| 294 | box-shadow: 0 0 0 2px rgba(255, 147, 0, 0.2);
|
| 295 | box-shadow: 0 0 0 var(--input-focus-shadow-spread, 2px) var(--color-calculate-input-feedback-warning-shadow, rgba(255, 147, 0, 0.2)); }
|
| 296 | .next-input.next-error {
|
| 297 | border-color: #FF3000;
|
| 298 | border-color: var(--input-feedback-error-border-color, #FF3000);
|
| 299 | background-color: #FFFFFF;
|
| 300 | background-color: var(--input-feedback-error-bg-color, #FFFFFF); }
|
| 301 | .next-input.next-error input, .next-input.next-error textarea {
|
| 302 | color: #333333;
|
| 303 | color: var(--input-feedback-error-color, #333333); }
|
| 304 | .next-input.next-error.next-focus, .next-input.next-error:hover {
|
| 305 | border-color: #FF3000;
|
| 306 | border-color: var(--input-feedback-error-border-color, #FF3000); }
|
| 307 | .next-input.next-error.next-focus {
|
| 308 | box-shadow: 0 0 0 2px rgba(255, 48, 0, 0.2);
|
| 309 | box-shadow: 0 0 0 var(--input-focus-shadow-spread, 2px) var(--color-calculate-input-feedback-error-shadow, rgba(255, 48, 0, 0.2)); }
|
| 310 | .next-input.next-hidden {
|
| 311 | display: none; }
|
| 312 | .next-input.next-noborder {
|
| 313 | border: none;
|
| 314 | box-shadow: none; }
|
| 315 | .next-input-control .next-input-len {
|
| 316 | font-size: 12px;
|
| 317 | font-size: var(--input-maxlen-font-size, 12px);
|
| 318 | line-height: 12px;
|
| 319 | line-height: var(--input-maxlen-font-size, 12px);
|
| 320 | color: #999999;
|
| 321 | color: var(--input-maxlen-color, #999999);
|
| 322 | display: table-cell;
|
| 323 | width: 1px;
|
| 324 | vertical-align: bottom; }
|
| 325 | .next-input-control .next-input-len.next-error {
|
| 326 | color: #FF3000;
|
| 327 | color: var(--input-maxlen-error-color, #FF3000); }
|
| 328 | .next-input-control .next-input-len.next-warning {
|
| 329 | color: #FF9300;
|
| 330 | color: var(--input-maxlen-warning-color, #FF9300); }
|
| 331 | .next-input-control > * {
|
| 332 | display: table-cell;
|
| 333 | width: 1%;
|
| 334 | top: 0; }
|
| 335 | .next-input-control > *:not(:last-child) {
|
| 336 | padding-right: 4px;
|
| 337 | padding-right: var(--s-1, 4px); }
|
| 338 | .next-input-control .next-icon {
|
| 339 | transition: all 100ms linear;
|
| 340 | transition: all var(--motion-duration-immediately, 100ms) var(--motion-linear, linear);
|
| 341 | color: #999999;
|
| 342 | color: var(--input-hint-color, #999999); }
|
| 343 | .next-input-control .next-input-warning-icon {
|
| 344 | color: #FF9300;
|
| 345 | color: var(--input-feedback-warning-color, #FF9300); }
|
| 346 | .next-input-control .next-input-warning-icon::before {
|
| 347 | content: "";
|
| 348 | content: var(--input-feedback-warning-icon, ""); }
|
| 349 | .next-input-control .next-input-success-icon {
|
| 350 | color: #46BC15;
|
| 351 | color: var(--input-feedback-success-color, #46BC15); }
|
| 352 | .next-input-control .next-input-success-icon::before {
|
| 353 | content: "";
|
| 354 | content: var(--input-feedback-success-icon, ""); }
|
| 355 | .next-input-control .next-input-loading-icon {
|
| 356 | color: #4494F9;
|
| 357 | color: var(--input-feedback-loading-color, #4494F9); }
|
| 358 | .next-input-control .next-input-loading-icon::before {
|
| 359 | content: "";
|
| 360 | content: var(--input-feedback-loading-icon, "");
|
| 361 | animation: loadingCircle 1s infinite linear; }
|
| 362 | .next-input-control .next-input-clear-icon::before {
|
| 363 | content: "";
|
| 364 | content: var(--input-feedback-clear-icon, ""); }
|
| 365 | .next-input-label, .next-input-inner-text {
|
| 366 | color: #666666;
|
| 367 | color: var(--input-label-color, #666666); }
|
| 368 | .next-input input::-moz-placeholder,
|
| 369 | .next-input textarea::-moz-placeholder {
|
| 370 | color: #999999;
|
| 371 | color: var(--input-placeholder-color, #999999);
|
| 372 | opacity: 1; }
|
| 373 | .next-input input:-ms-input-placeholder,
|
| 374 | .next-input textarea:-ms-input-placeholder {
|
| 375 | color: #999999;
|
| 376 | color: var(--input-placeholder-color, #999999); }
|
| 377 | .next-input input::-webkit-input-placeholder,
|
| 378 | .next-input textarea::-webkit-input-placeholder {
|
| 379 | color: #999999;
|
| 380 | color: var(--input-placeholder-color, #999999); }
|
| 381 | .next-input.next-disabled {
|
| 382 | color: #CCCCCC;
|
| 383 | color: var(--input-disabled-color, #CCCCCC);
|
| 384 | border-color: #E6E7EB;
|
| 385 | border-color: var(--input-disabled-border-color, #E6E7EB);
|
| 386 | background-color: #F7F8FA;
|
| 387 | background-color: var(--input-disabled-bg-color, #F7F8FA);
|
| 388 | cursor: not-allowed; }
|
| 389 | .next-input.next-disabled:hover {
|
| 390 | border-color: #E6E7EB;
|
| 391 | border-color: var(--input-disabled-border-color, #E6E7EB);
|
| 392 | background-color: #F7F8FA;
|
| 393 | background-color: var(--input-disabled-bg-color, #F7F8FA); }
|
| 394 | .next-input.next-disabled input, .next-input.next-disabled textarea {
|
| 395 | -webkit-text-fill-color: #CCCCCC;
|
| 396 | -webkit-text-fill-color: var(--input-disabled-color, #CCCCCC);
|
| 397 | color: #CCCCCC;
|
| 398 | color: var(--input-disabled-color, #CCCCCC); }
|
| 399 | .next-input.next-disabled input::-moz-placeholder, .next-input.next-disabled textarea::-moz-placeholder {
|
| 400 | color: #CCCCCC;
|
| 401 | color: var(--input-disabled-color, #CCCCCC);
|
| 402 | opacity: 1; }
|
| 403 | .next-input.next-disabled input:-ms-input-placeholder, .next-input.next-disabled textarea:-ms-input-placeholder {
|
| 404 | color: #CCCCCC;
|
| 405 | color: var(--input-disabled-color, #CCCCCC); }
|
| 406 | .next-input.next-disabled input::-webkit-input-placeholder, .next-input.next-disabled textarea::-webkit-input-placeholder {
|
| 407 | color: #CCCCCC;
|
| 408 | color: var(--input-disabled-color, #CCCCCC); }
|
| 409 | .next-input.next-disabled .next-input-label, .next-input.next-disabled .next-input-inner-text {
|
| 410 | color: #CCCCCC;
|
| 411 | color: var(--input-disabled-color, #CCCCCC); }
|
| 412 | .next-input.next-disabled .next-input-len {
|
| 413 | color: #CCCCCC;
|
| 414 | color: var(--input-disabled-color, #CCCCCC); }
|
| 415 | .next-input.next-disabled .next-input-hint-wrap {
|
| 416 | color: #CCCCCC;
|
| 417 | color: var(--input-disabled-color, #CCCCCC); }
|
| 418 | .next-input.next-disabled .next-input-hint-wrap .next-input-clear {
|
| 419 | opacity: 0; }
|
| 420 | .next-input.next-disabled .next-input-hint-wrap .next-input-hint {
|
| 421 | opacity: 1; }
|
| 422 | .next-input.next-disabled .next-input-hint-wrap .next-input-clear-icon:hover {
|
| 423 | cursor: not-allowed;
|
| 424 | color: #CCCCCC;
|
| 425 | color: var(--input-disabled-color, #CCCCCC); }
|
| 426 | .next-input.next-disabled .next-icon {
|
| 427 | color: #CCCCCC;
|
| 428 | color: var(--input-disabled-color, #CCCCCC); }
|
| 429 | .next-input-inner, .next-input-control, .next-input-label {
|
| 430 | display: table-cell;
|
| 431 | width: 1px;
|
| 432 | vertical-align: middle;
|
| 433 | line-height: 1;
|
| 434 | background-color: transparent;
|
| 435 | white-space: nowrap; }
|
| 436 | .next-input-group {
|
| 437 | box-sizing: border-box;
|
| 438 | display: inline-table;
|
| 439 | border-collapse: separate;
|
| 440 | border-spacing: 0;
|
| 441 | line-height: 0;
|
| 442 | width: 100%; }
|
| 443 | .next-input-group *,
|
| 444 | .next-input-group *:before,
|
| 445 | .next-input-group *:after {
|
| 446 | box-sizing: border-box; }
|
| 447 | .next-input-group-auto-width {
|
| 448 | width: 100%;
|
| 449 | border-radius: 0 !important; }
|
| 450 | .next-input-group > .next-input {
|
| 451 | border-radius: 0; }
|
| 452 | .next-input-group > .next-input.next-focus {
|
| 453 | position: relative;
|
| 454 | z-index: 1; }
|
| 455 | .next-input-group > .next-input:first-child.next-small {
|
| 456 | border-top-left-radius: 3px !important;
|
| 457 | border-top-left-radius: var(--form-element-small-corner, 3px) !important;
|
| 458 | border-bottom-left-radius: 3px !important;
|
| 459 | border-bottom-left-radius: var(--form-element-small-corner, 3px) !important; }
|
| 460 | .next-input-group > .next-input:first-child.next-medium {
|
| 461 | border-top-left-radius: 3px !important;
|
| 462 | border-top-left-radius: var(--form-element-medium-corner, 3px) !important;
|
| 463 | border-bottom-left-radius: 3px !important;
|
| 464 | border-bottom-left-radius: var(--form-element-medium-corner, 3px) !important; }
|
| 465 | .next-input-group > .next-input:first-child.next-large {
|
| 466 | border-top-left-radius: 3px !important;
|
| 467 | border-top-left-radius: var(--form-element-large-corner, 3px) !important;
|
| 468 | border-bottom-left-radius: 3px !important;
|
| 469 | border-bottom-left-radius: var(--form-element-large-corner, 3px) !important; }
|
| 470 | .next-input-group > .next-input:last-child.next-small {
|
| 471 | border-top-right-radius: 3px !important;
|
| 472 | border-top-right-radius: var(--form-element-small-corner, 3px) !important;
|
| 473 | border-bottom-right-radius: 3px !important;
|
| 474 | border-bottom-right-radius: var(--form-element-small-corner, 3px) !important; }
|
| 475 | .next-input-group > .next-input:last-child.next-medium {
|
| 476 | border-top-right-radius: 3px !important;
|
| 477 | border-top-right-radius: var(--form-element-medium-corner, 3px) !important;
|
| 478 | border-bottom-right-radius: 3px !important;
|
| 479 | border-bottom-right-radius: var(--form-element-medium-corner, 3px) !important; }
|
| 480 | .next-input-group > .next-input:last-child.next-large {
|
| 481 | border-top-right-radius: 3px !important;
|
| 482 | border-top-right-radius: var(--form-element-large-corner, 3px) !important;
|
| 483 | border-bottom-right-radius: 3px !important;
|
| 484 | border-bottom-right-radius: var(--form-element-large-corner, 3px) !important; }
|
| 485 | .next-input-group-addon {
|
| 486 | width: 1px;
|
| 487 | display: table-cell;
|
| 488 | vertical-align: middle;
|
| 489 | white-space: nowrap;
|
| 490 | }
|
| 491 | .next-input-group-addon:first-child {
|
| 492 | border-bottom-right-radius: 0 !important;
|
| 493 | border-top-right-radius: 0 !important; }
|
| 494 | .next-input-group-addon:first-child > * {
|
| 495 | margin-right: -1px;
|
| 496 | margin-right: calc(0px - var(--input-border-width, 1px));
|
| 497 | border-bottom-right-radius: 0 !important;
|
| 498 | border-top-right-radius: 0 !important; }
|
| 499 | .next-input-group-addon:first-child > *.next-focus {
|
| 500 | position: relative;
|
| 501 | z-index: 1; }
|
| 502 | .next-input-group-addon:first-child > * > .next-input {
|
| 503 | border-bottom-right-radius: 0 !important;
|
| 504 | border-top-right-radius: 0 !important; }
|
| 505 | .next-input-group-addon:first-child > * > .next-input.next-focus {
|
| 506 | position: relative;
|
| 507 | z-index: 1; }
|
| 508 | .next-input-group-addon:last-child {
|
| 509 | border-bottom-left-radius: 0 !important;
|
| 510 | border-top-left-radius: 0 !important; }
|
| 511 | .next-input-group-addon:last-child > * {
|
| 512 | margin-left: -1px;
|
| 513 | margin-left: calc(0px - var(--input-border-width, 1px));
|
| 514 | border-bottom-left-radius: 0 !important;
|
| 515 | border-top-left-radius: 0 !important; }
|
| 516 | .next-input-group-addon:last-child > * > .next-input {
|
| 517 | border-bottom-left-radius: 0 !important;
|
| 518 | border-top-left-radius: 0 !important; }
|
| 519 | .next-input-group-text {
|
| 520 | color: #999999;
|
| 521 | color: var(--input-addon-text-color, #999999);
|
| 522 | background-color: #F2F3F7;
|
| 523 | background-color: var(--input-addon-bg-color, #F2F3F7);
|
| 524 | text-align: center;
|
| 525 | border: 1px solid #C4C6CF;
|
| 526 | border: var(--input-border-width, 1px) solid var(--input-border-color, #C4C6CF);
|
| 527 | padding: 0 8px;
|
| 528 | padding: 0 var(--input-addon-padding, 8px); }
|
| 529 | .next-input-group-text:first-child {
|
| 530 | border-right-width: 0; }
|
| 531 | .next-input-group-text:last-child {
|
| 532 | border-left-width: 0; }
|
| 533 | .next-input-group-text.next-disabled {
|
| 534 | color: #CCCCCC;
|
| 535 | color: var(--input-disabled-color, #CCCCCC);
|
| 536 | border-color: #E6E7EB;
|
| 537 | border-color: var(--input-disabled-border-color, #E6E7EB);
|
| 538 | background-color: #F7F8FA;
|
| 539 | background-color: var(--input-disabled-bg-color, #F7F8FA);
|
| 540 | cursor: not-allowed; }
|
| 541 | .next-input-group-text.next-disabled:hover {
|
| 542 | border-color: #E6E7EB;
|
| 543 | border-color: var(--input-disabled-border-color, #E6E7EB);
|
| 544 | background-color: #F7F8FA;
|
| 545 | background-color: var(--input-disabled-bg-color, #F7F8FA); }
|
| 546 | .next-input-group-text.next-small {
|
| 547 | font-size: 12px;
|
| 548 | font-size: var(--form-element-small-font-size, 12px);
|
| 549 | border-radius: 3px;
|
| 550 | border-radius: var(--form-element-small-corner, 3px); }
|
| 551 | .next-input-group-text.next-medium {
|
| 552 | font-size: 12px;
|
| 553 | font-size: var(--form-element-medium-font-size, 12px);
|
| 554 | border-radius: 3px;
|
| 555 | border-radius: var(--form-element-medium-corner, 3px); }
|
| 556 | .next-input-group-text.next-large {
|
| 557 | font-size: 16px;
|
| 558 | font-size: var(--form-element-large-font-size, 16px);
|
| 559 | border-radius: 3px;
|
| 560 | border-radius: var(--form-element-large-corner, 3px); }
|
| 561 |
|
| 562 | .next-input[dir="rtl"].next-small .next-input-label {
|
| 563 | padding-left: 0;
|
| 564 | padding-right: 8px;
|
| 565 | padding-right: var(--input-s-label-padding-left, 8px); }
|
| 566 |
|
| 567 | .next-input[dir="rtl"].next-small .next-input-control {
|
| 568 | padding-right: 0;
|
| 569 | padding-left: 4px;
|
| 570 | padding-left: var(--input-s-icon-padding-right, 4px); }
|
| 571 |
|
| 572 | .next-input[dir="rtl"].next-medium .next-input-label {
|
| 573 | padding-left: 0;
|
| 574 | padding-right: 8px;
|
| 575 | padding-right: var(--input-m-label-padding-left, 8px); }
|
| 576 |
|
| 577 | .next-input[dir="rtl"].next-medium .next-input-control {
|
| 578 | padding-right: 0;
|
| 579 | padding-left: 8px;
|
| 580 | padding-left: var(--input-m-icon-padding-right, 8px); }
|
| 581 |
|
| 582 | .next-input[dir="rtl"].next-large .next-input-label {
|
| 583 | padding-left: 0;
|
| 584 | padding-right: 12px;
|
| 585 | padding-right: var(--input-l-label-padding-left, 12px); }
|
| 586 |
|
| 587 | .next-input[dir="rtl"].next-large .next-input-control {
|
| 588 | padding-right: 0;
|
| 589 | padding-left: 8px;
|
| 590 | padding-left: var(--input-l-icon-padding-right, 8px); }
|
| 591 |
|
| 592 | .next-input[dir="rtl"].next-input-textarea .next-input-len {
|
| 593 | text-align: left; }
|
| 594 |
|
| 595 | .next-input[dir="rtl"] .next-input-control > *:not(:last-child) {
|
| 596 | padding-left: 4px;
|
| 597 | padding-left: var(--s-1, 4px);
|
| 598 | padding-right: 0; }
|
| 599 |
|
| 600 | .next-input-group[dir="rtl"] > .next-input:first-child.next-small {
|
| 601 | border-top-left-radius: 0 !important;
|
| 602 | border-bottom-left-radius: 0 !important;
|
| 603 | border-top-right-radius: 3px !important;
|
| 604 | border-top-right-radius: var(--form-element-small-corner, 3px) !important;
|
| 605 | border-bottom-right-radius: 3px !important;
|
| 606 | border-bottom-right-radius: var(--form-element-small-corner, 3px) !important; }
|
| 607 |
|
| 608 | .next-input-group[dir="rtl"] > .next-input:first-child.next-medium {
|
| 609 | border-top-left-radius: 0 !important;
|
| 610 | border-bottom-left-radius: 0 !important;
|
| 611 | border-top-right-radius: 3px !important;
|
| 612 | border-top-right-radius: var(--form-element-medium-corner, 3px) !important;
|
| 613 | border-bottom-right-radius: 3px !important;
|
| 614 | border-bottom-right-radius: var(--form-element-medium-corner, 3px) !important; }
|
| 615 |
|
| 616 | .next-input-group[dir="rtl"] > .next-input:first-child.next-large {
|
| 617 | border-top-left-radius: 0 !important;
|
| 618 | border-bottom-left-radius: 0 !important;
|
| 619 | border-top-right-radius: 3px !important;
|
| 620 | border-top-right-radius: var(--form-element-large-corner, 3px) !important;
|
| 621 | border-bottom-right-radius: 3px !important;
|
| 622 | border-bottom-right-radius: var(--form-element-large-corner, 3px) !important; }
|
| 623 |
|
| 624 | .next-input-group[dir="rtl"] > .next-input:last-child.next-small {
|
| 625 | border-top-left-radius: 3px !important;
|
| 626 | border-top-left-radius: var(--form-element-small-corner, 3px) !important;
|
| 627 | border-bottom-left-radius: 3px !important;
|
| 628 | border-bottom-left-radius: var(--form-element-small-corner, 3px) !important;
|
| 629 | border-top-right-radius: 0 !important;
|
| 630 | border-bottom-right-radius: 0 !important; }
|
| 631 |
|
| 632 | .next-input-group[dir="rtl"] > .next-input:last-child.next-medium {
|
| 633 | border-top-left-radius: 3px !important;
|
| 634 | border-top-left-radius: var(--form-element-medium-corner, 3px) !important;
|
| 635 | border-bottom-left-radius: 3px !important;
|
| 636 | border-bottom-left-radius: var(--form-element-medium-corner, 3px) !important;
|
| 637 | border-top-right-radius: 0 !important;
|
| 638 | border-bottom-right-radius: 0 !important; }
|
| 639 |
|
| 640 | .next-input-group[dir="rtl"] > .next-input:last-child.next-large {
|
| 641 | border-top-left-radius: 3px !important;
|
| 642 | border-top-left-radius: var(--form-element-large-corner, 3px) !important;
|
| 643 | border-bottom-left-radius: 3px !important;
|
| 644 | border-bottom-left-radius: var(--form-element-large-corner, 3px) !important;
|
| 645 | border-top-right-radius: 0 !important;
|
| 646 | border-bottom-right-radius: 0 !important; }
|
| 647 |
|
| 648 | .next-input-group[dir="rtl"] .next-input-group-addon {
|
| 649 | }
|
| 650 | .next-input-group[dir="rtl"] .next-input-group-addon:first-child,
|
| 651 | .next-input-group[dir="rtl"] .next-input-group-addon:first-child > .next-input,
|
| 652 | .next-input-group[dir="rtl"] .next-input-group-addon:first-child > * > .next-input {
|
| 653 | border-bottom-left-radius: 0 !important;
|
| 654 | border-top-left-radius: 0 !important; }
|
| 655 | .next-input-group[dir="rtl"] .next-input-group-addon:first-child.next-small,
|
| 656 | .next-input-group[dir="rtl"] .next-input-group-addon:first-child > .next-input.next-small,
|
| 657 | .next-input-group[dir="rtl"] .next-input-group-addon:first-child > * > .next-input.next-small {
|
| 658 | border-bottom-right-radius: 3px !important;
|
| 659 | border-bottom-right-radius: var(--form-element-small-corner, 3px) !important;
|
| 660 | border-top-right-radius: 3px !important;
|
| 661 | border-top-right-radius: var(--form-element-small-corner, 3px) !important; }
|
| 662 | .next-input-group[dir="rtl"] .next-input-group-addon:first-child.next-medium,
|
| 663 | .next-input-group[dir="rtl"] .next-input-group-addon:first-child > .next-input.next-medium,
|
| 664 | .next-input-group[dir="rtl"] .next-input-group-addon:first-child > * > .next-input.next-medium {
|
| 665 | border-bottom-right-radius: 3px !important;
|
| 666 | border-bottom-right-radius: var(--form-element-medium-corner, 3px) !important;
|
| 667 | border-top-right-radius: 3px !important;
|
| 668 | border-top-right-radius: var(--form-element-medium-corner, 3px) !important; }
|
| 669 | .next-input-group[dir="rtl"] .next-input-group-addon:first-child.next-large,
|
| 670 | .next-input-group[dir="rtl"] .next-input-group-addon:first-child > .next-input.next-large,
|
| 671 | .next-input-group[dir="rtl"] .next-input-group-addon:first-child > * > .next-input.next-large {
|
| 672 | border-bottom-right-radius: 3px !important;
|
| 673 | border-bottom-right-radius: var(--form-element-large-corner, 3px) !important;
|
| 674 | border-top-right-radius: 3px !important;
|
| 675 | border-top-right-radius: var(--form-element-large-corner, 3px) !important; }
|
| 676 | .next-input-group[dir="rtl"] .next-input-group-addon:first-child > * {
|
| 677 | margin-left: -1px;
|
| 678 | margin-left: calc(0px - var(--input-border-width, 1px));
|
| 679 | border-bottom-left-radius: 0 !important;
|
| 680 | border-top-left-radius: 0 !important; }
|
| 681 | .next-input-group[dir="rtl"] .next-input-group-addon:last-child,
|
| 682 | .next-input-group[dir="rtl"] .next-input-group-addon:last-child > .next-input,
|
| 683 | .next-input-group[dir="rtl"] .next-input-group-addon:last-child > * > .next-input {
|
| 684 | border-bottom-right-radius: 0 !important;
|
| 685 | border-top-right-radius: 0 !important; }
|
| 686 | .next-input-group[dir="rtl"] .next-input-group-addon:last-child.next-small,
|
| 687 | .next-input-group[dir="rtl"] .next-input-group-addon:last-child > .next-input.next-small,
|
| 688 | .next-input-group[dir="rtl"] .next-input-group-addon:last-child > * > .next-input.next-small {
|
| 689 | border-bottom-left-radius: 3px !important;
|
| 690 | border-bottom-left-radius: var(--form-element-small-corner, 3px) !important;
|
| 691 | border-top-left-radius: 3px !important;
|
| 692 | border-top-left-radius: var(--form-element-small-corner, 3px) !important; }
|
| 693 | .next-input-group[dir="rtl"] .next-input-group-addon:last-child.next-medium,
|
| 694 | .next-input-group[dir="rtl"] .next-input-group-addon:last-child > .next-input.next-medium,
|
| 695 | .next-input-group[dir="rtl"] .next-input-group-addon:last-child > * > .next-input.next-medium {
|
| 696 | border-bottom-left-radius: 3px !important;
|
| 697 | border-bottom-left-radius: var(--form-element-medium-corner, 3px) !important;
|
| 698 | border-top-left-radius: 3px !important;
|
| 699 | border-top-left-radius: var(--form-element-medium-corner, 3px) !important; }
|
| 700 | .next-input-group[dir="rtl"] .next-input-group-addon:last-child.next-large,
|
| 701 | .next-input-group[dir="rtl"] .next-input-group-addon:last-child > .next-input.next-large,
|
| 702 | .next-input-group[dir="rtl"] .next-input-group-addon:last-child > * > .next-input.next-large {
|
| 703 | border-bottom-left-radius: 3px !important;
|
| 704 | border-bottom-left-radius: var(--form-element-large-corner, 3px) !important;
|
| 705 | border-top-left-radius: 3px !important;
|
| 706 | border-top-left-radius: var(--form-element-large-corner, 3px) !important; }
|
| 707 | .next-input-group[dir="rtl"] .next-input-group-addon:last-child > * {
|
| 708 | margin-right: -1px;
|
| 709 | margin-right: calc(0px - var(--input-border-width, 1px));
|
| 710 | border-bottom-right-radius: 0 !important;
|
| 711 | border-top-right-radius: 0 !important; }
|
| 712 |
|
| 713 | .next-input-group[dir="rtl"] .next-input-group-text:first-child {
|
| 714 | border-right-width: 1px;
|
| 715 | border-right-width: var(--input-border-width, 1px);
|
| 716 | border-left: 0; }
|
| 717 |
|
| 718 | .next-input-group[dir="rtl"] .next-input-group-text:last-child {
|
| 719 | border-left-width: 1px;
|
| 720 | border-left-width: var(--input-border-width, 1px);
|
| 721 | border-right: 0; }
|