UNPKG

63.3 kBCSSView Raw
1/**
2 * @license
3 * Copyright Google LLC All Rights Reserved.
4 *
5 * Use of this source code is governed by an MIT-style license that can be
6 * found in the LICENSE file at https://github.com/material-components/material-components-web/blob/master/LICENSE
7 */
8@charset "UTF-8";
9.mdc-floating-label {
10 -moz-osx-font-smoothing: grayscale;
11 -webkit-font-smoothing: antialiased;
12 font-family: Roboto, sans-serif;
13 /* @alternate */
14 font-family: var(--mdc-typography-subtitle1-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));
15 font-size: 1rem;
16 /* @alternate */
17 font-size: var(--mdc-typography-subtitle1-font-size, 1rem);
18 font-weight: 400;
19 /* @alternate */
20 font-weight: var(--mdc-typography-subtitle1-font-weight, 400);
21 letter-spacing: 0.009375em;
22 /* @alternate */
23 letter-spacing: var(--mdc-typography-subtitle1-letter-spacing, 0.009375em);
24 text-decoration: inherit;
25 /* @alternate */
26 -webkit-text-decoration: var(--mdc-typography-subtitle1-text-decoration, inherit);
27 text-decoration: var(--mdc-typography-subtitle1-text-decoration, inherit);
28 text-transform: inherit;
29 /* @alternate */
30 text-transform: var(--mdc-typography-subtitle1-text-transform, inherit);
31 position: absolute;
32 /* @noflip */
33 /*rtl:ignore*/
34 left: 0;
35 /* @noflip */
36 /*rtl:ignore*/
37 -webkit-transform-origin: left top;
38 /* @noflip */
39 /*rtl:ignore*/
40 transform-origin: left top;
41 line-height: 1.15rem;
42 text-align: left;
43 text-overflow: ellipsis;
44 white-space: nowrap;
45 cursor: text;
46 overflow: hidden;
47 /* @alternate */
48 will-change: transform;
49 transition: color 150ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 150ms cubic-bezier(0.4, 0, 0.2, 1);
50 transition: transform 150ms cubic-bezier(0.4, 0, 0.2, 1), color 150ms cubic-bezier(0.4, 0, 0.2, 1);
51 transition: transform 150ms cubic-bezier(0.4, 0, 0.2, 1), color 150ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 150ms cubic-bezier(0.4, 0, 0.2, 1);
52}
53[dir=rtl] .mdc-floating-label, .mdc-floating-label[dir=rtl] {
54 /*rtl:begin:ignore*/
55 /* @noflip */
56 /*rtl:ignore*/
57 right: 0;
58 /* @noflip */
59 /*rtl:ignore*/
60 left: auto;
61 /* @noflip */
62 /*rtl:ignore*/
63 -webkit-transform-origin: right top;
64 /* @noflip */
65 /*rtl:ignore*/
66 transform-origin: right top;
67 /* @noflip */
68 /*rtl:ignore*/
69 text-align: right;
70 /*rtl:end:ignore*/
71}
72
73.mdc-floating-label--float-above {
74 cursor: auto;
75}
76
77.mdc-floating-label--required::after {
78 /* @noflip */
79 /*rtl:ignore*/
80 margin-left: 1px;
81 /* @noflip */
82 /*rtl:ignore*/
83 margin-right: 0px;
84 content: "*";
85}
86[dir=rtl] .mdc-floating-label--required, .mdc-floating-label--required[dir=rtl] {
87 /*rtl:begin:ignore*/
88 /*rtl:end:ignore*/
89}
90[dir=rtl] .mdc-floating-label--required::after, .mdc-floating-label--required[dir=rtl]::after {
91 /* @noflip */
92 /*rtl:ignore*/
93 margin-left: 0;
94 /* @noflip */
95 /*rtl:ignore*/
96 margin-right: 1px;
97}
98
99.mdc-floating-label--float-above {
100 -webkit-transform: translateY(-106%) scale(0.75);
101 transform: translateY(-106%) scale(0.75);
102}
103
104.mdc-floating-label--shake {
105 -webkit-animation: mdc-floating-label-shake-float-above-standard 250ms 1;
106 animation: mdc-floating-label-shake-float-above-standard 250ms 1;
107}
108
109@-webkit-keyframes mdc-floating-label-shake-float-above-standard {
110 0% {
111 /* @noflip */
112 /*rtl:ignore*/
113 -webkit-transform: translateX(calc(0 - 0%)) translateY(-106%) scale(0.75);
114 transform: translateX(calc(0 - 0%)) translateY(-106%) scale(0.75);
115 }
116 33% {
117 -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.701732, 0.495819);
118 animation-timing-function: cubic-bezier(0.5, 0, 0.701732, 0.495819);
119 /* @noflip */
120 /*rtl:ignore*/
121 -webkit-transform: translateX(calc(4% - 0%)) translateY(-106%) scale(0.75);
122 transform: translateX(calc(4% - 0%)) translateY(-106%) scale(0.75);
123 }
124 66% {
125 -webkit-animation-timing-function: cubic-bezier(0.302435, 0.381352, 0.55, 0.956352);
126 animation-timing-function: cubic-bezier(0.302435, 0.381352, 0.55, 0.956352);
127 /* @noflip */
128 /*rtl:ignore*/
129 -webkit-transform: translateX(calc(-4% - 0%)) translateY(-106%) scale(0.75);
130 transform: translateX(calc(-4% - 0%)) translateY(-106%) scale(0.75);
131 }
132 100% {
133 /* @noflip */
134 /*rtl:ignore*/
135 -webkit-transform: translateX(calc(0 - 0%)) translateY(-106%) scale(0.75);
136 transform: translateX(calc(0 - 0%)) translateY(-106%) scale(0.75);
137 }
138}
139
140@keyframes mdc-floating-label-shake-float-above-standard {
141 0% {
142 /* @noflip */
143 /*rtl:ignore*/
144 -webkit-transform: translateX(calc(0 - 0%)) translateY(-106%) scale(0.75);
145 transform: translateX(calc(0 - 0%)) translateY(-106%) scale(0.75);
146 }
147 33% {
148 -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.701732, 0.495819);
149 animation-timing-function: cubic-bezier(0.5, 0, 0.701732, 0.495819);
150 /* @noflip */
151 /*rtl:ignore*/
152 -webkit-transform: translateX(calc(4% - 0%)) translateY(-106%) scale(0.75);
153 transform: translateX(calc(4% - 0%)) translateY(-106%) scale(0.75);
154 }
155 66% {
156 -webkit-animation-timing-function: cubic-bezier(0.302435, 0.381352, 0.55, 0.956352);
157 animation-timing-function: cubic-bezier(0.302435, 0.381352, 0.55, 0.956352);
158 /* @noflip */
159 /*rtl:ignore*/
160 -webkit-transform: translateX(calc(-4% - 0%)) translateY(-106%) scale(0.75);
161 transform: translateX(calc(-4% - 0%)) translateY(-106%) scale(0.75);
162 }
163 100% {
164 /* @noflip */
165 /*rtl:ignore*/
166 -webkit-transform: translateX(calc(0 - 0%)) translateY(-106%) scale(0.75);
167 transform: translateX(calc(0 - 0%)) translateY(-106%) scale(0.75);
168 }
169}
170@-webkit-keyframes mdc-ripple-fg-radius-in {
171 from {
172 -webkit-animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
173 animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
174 -webkit-transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
175 transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
176 }
177 to {
178 -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
179 transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
180 }
181}
182@keyframes mdc-ripple-fg-radius-in {
183 from {
184 -webkit-animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
185 animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
186 -webkit-transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
187 transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
188 }
189 to {
190 -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
191 transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
192 }
193}
194@-webkit-keyframes mdc-ripple-fg-opacity-in {
195 from {
196 -webkit-animation-timing-function: linear;
197 animation-timing-function: linear;
198 opacity: 0;
199 }
200 to {
201 opacity: var(--mdc-ripple-fg-opacity, 0);
202 }
203}
204@keyframes mdc-ripple-fg-opacity-in {
205 from {
206 -webkit-animation-timing-function: linear;
207 animation-timing-function: linear;
208 opacity: 0;
209 }
210 to {
211 opacity: var(--mdc-ripple-fg-opacity, 0);
212 }
213}
214@-webkit-keyframes mdc-ripple-fg-opacity-out {
215 from {
216 -webkit-animation-timing-function: linear;
217 animation-timing-function: linear;
218 opacity: var(--mdc-ripple-fg-opacity, 0);
219 }
220 to {
221 opacity: 0;
222 }
223}
224@keyframes mdc-ripple-fg-opacity-out {
225 from {
226 -webkit-animation-timing-function: linear;
227 animation-timing-function: linear;
228 opacity: var(--mdc-ripple-fg-opacity, 0);
229 }
230 to {
231 opacity: 0;
232 }
233}
234.mdc-line-ripple::before, .mdc-line-ripple::after {
235 position: absolute;
236 bottom: 0;
237 left: 0;
238 width: 100%;
239 border-bottom-style: solid;
240 content: "";
241}
242.mdc-line-ripple::before {
243 border-bottom-width: 1px;
244}
245.mdc-line-ripple::before {
246 z-index: 1;
247}
248.mdc-line-ripple::after {
249 -webkit-transform: scaleX(0);
250 transform: scaleX(0);
251 border-bottom-width: 2px;
252 opacity: 0;
253 z-index: 2;
254}
255.mdc-line-ripple::after {
256 transition: opacity 180ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 180ms cubic-bezier(0.4, 0, 0.2, 1);
257 transition: transform 180ms cubic-bezier(0.4, 0, 0.2, 1), opacity 180ms cubic-bezier(0.4, 0, 0.2, 1);
258 transition: transform 180ms cubic-bezier(0.4, 0, 0.2, 1), opacity 180ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 180ms cubic-bezier(0.4, 0, 0.2, 1);
259}
260
261.mdc-line-ripple--active::after {
262 -webkit-transform: scaleX(1);
263 transform: scaleX(1);
264 opacity: 1;
265}
266
267.mdc-line-ripple--deactivating::after {
268 opacity: 0;
269}
270
271.mdc-notched-outline {
272 display: flex;
273 position: absolute;
274 top: 0;
275 right: 0;
276 left: 0;
277 box-sizing: border-box;
278 width: 100%;
279 max-width: 100%;
280 height: 100%;
281 /* @noflip */
282 /*rtl:ignore*/
283 text-align: left;
284 pointer-events: none;
285}
286[dir=rtl] .mdc-notched-outline, .mdc-notched-outline[dir=rtl] {
287 /*rtl:begin:ignore*/
288 /* @noflip */
289 /*rtl:ignore*/
290 text-align: right;
291 /*rtl:end:ignore*/
292}
293
294.mdc-notched-outline__leading, .mdc-notched-outline__notch, .mdc-notched-outline__trailing {
295 box-sizing: border-box;
296 height: 100%;
297 border-top: 1px solid;
298 border-bottom: 1px solid;
299 pointer-events: none;
300}
301.mdc-notched-outline__leading {
302 /* @noflip */
303 /*rtl:ignore*/
304 border-left: 1px solid;
305 /* @noflip */
306 /*rtl:ignore*/
307 border-right: none;
308 width: 12px;
309}
310[dir=rtl] .mdc-notched-outline__leading, .mdc-notched-outline__leading[dir=rtl] {
311 /*rtl:begin:ignore*/
312 /* @noflip */
313 /*rtl:ignore*/
314 border-left: none;
315 /* @noflip */
316 /*rtl:ignore*/
317 border-right: 1px solid;
318 /*rtl:end:ignore*/
319}
320
321.mdc-notched-outline__trailing {
322 /* @noflip */
323 /*rtl:ignore*/
324 border-left: none;
325 /* @noflip */
326 /*rtl:ignore*/
327 border-right: 1px solid;
328 flex-grow: 1;
329}
330[dir=rtl] .mdc-notched-outline__trailing, .mdc-notched-outline__trailing[dir=rtl] {
331 /*rtl:begin:ignore*/
332 /* @noflip */
333 /*rtl:ignore*/
334 border-left: 1px solid;
335 /* @noflip */
336 /*rtl:ignore*/
337 border-right: none;
338 /*rtl:end:ignore*/
339}
340
341.mdc-notched-outline__notch {
342 flex: 0 0 auto;
343 width: auto;
344 max-width: calc(100% - 12px * 2);
345}
346.mdc-notched-outline .mdc-floating-label {
347 display: inline-block;
348 position: relative;
349 max-width: 100%;
350}
351.mdc-notched-outline .mdc-floating-label--float-above {
352 text-overflow: clip;
353}
354.mdc-notched-outline--upgraded .mdc-floating-label--float-above {
355 max-width: 133.3333333333%;
356}
357
358.mdc-notched-outline--notched .mdc-notched-outline__notch {
359 /* @noflip */
360 /*rtl:ignore*/
361 padding-left: 0;
362 /* @noflip */
363 /*rtl:ignore*/
364 padding-right: 8px;
365 border-top: none;
366}
367[dir=rtl] .mdc-notched-outline--notched .mdc-notched-outline__notch, .mdc-notched-outline--notched .mdc-notched-outline__notch[dir=rtl] {
368 /*rtl:begin:ignore*/
369 /* @noflip */
370 /*rtl:ignore*/
371 padding-left: 8px;
372 /* @noflip */
373 /*rtl:ignore*/
374 padding-right: 0;
375 /*rtl:end:ignore*/
376}
377
378.mdc-notched-outline--no-label .mdc-notched-outline__notch {
379 display: none;
380}
381
382.mdc-select {
383 display: inline-flex;
384 position: relative;
385}
386.mdc-select:not(.mdc-select--disabled) .mdc-select__selected-text {
387 color: rgba(0, 0, 0, 0.87);
388}
389.mdc-select.mdc-select--disabled .mdc-select__selected-text {
390 color: rgba(0, 0, 0, 0.38);
391}
392.mdc-select:not(.mdc-select--disabled) .mdc-floating-label {
393 color: rgba(0, 0, 0, 0.6);
394}
395.mdc-select:not(.mdc-select--disabled).mdc-select--focused .mdc-floating-label {
396 color: rgba(98, 0, 238, 0.87);
397}
398.mdc-select.mdc-select--disabled .mdc-floating-label {
399 color: rgba(0, 0, 0, 0.38);
400}
401.mdc-select:not(.mdc-select--disabled) .mdc-select__dropdown-icon {
402 fill: rgba(0, 0, 0, 0.54);
403}
404.mdc-select:not(.mdc-select--disabled).mdc-select--focused .mdc-select__dropdown-icon {
405 fill: #6200ee;
406 /* @alternate */
407 fill: var(--mdc-theme-primary, #6200ee);
408}
409.mdc-select.mdc-select--disabled .mdc-select__dropdown-icon {
410 fill: rgba(0, 0, 0, 0.38);
411}
412.mdc-select:not(.mdc-select--disabled) + .mdc-select-helper-text {
413 color: rgba(0, 0, 0, 0.6);
414}
415.mdc-select.mdc-select--disabled + .mdc-select-helper-text {
416 color: rgba(0, 0, 0, 0.38);
417}
418.mdc-select:not(.mdc-select--disabled) .mdc-select__icon {
419 color: rgba(0, 0, 0, 0.54);
420}
421.mdc-select.mdc-select--disabled .mdc-select__icon {
422 color: rgba(0, 0, 0, 0.38);
423}
424@media screen and (forced-colors: active), (-ms-high-contrast: active) {
425 .mdc-select.mdc-select--disabled .mdc-select__selected-text {
426 color: GrayText;
427 }
428 .mdc-select.mdc-select--disabled .mdc-select__dropdown-icon {
429 fill: red;
430 }
431 .mdc-select.mdc-select--disabled .mdc-floating-label {
432 color: GrayText;
433 }
434 .mdc-select.mdc-select--disabled .mdc-line-ripple::before {
435 border-bottom-color: GrayText;
436 }
437 .mdc-select.mdc-select--disabled .mdc-notched-outline__leading,
438.mdc-select.mdc-select--disabled .mdc-notched-outline__notch,
439.mdc-select.mdc-select--disabled .mdc-notched-outline__trailing {
440 border-color: GrayText;
441 }
442 .mdc-select.mdc-select--disabled .mdc-select__icon {
443 color: GrayText;
444 }
445 .mdc-select.mdc-select--disabled + .mdc-select-helper-text {
446 color: GrayText;
447 }
448}
449.mdc-select .mdc-floating-label {
450 top: 50%;
451 -webkit-transform: translateY(-50%);
452 transform: translateY(-50%);
453 pointer-events: none;
454}
455.mdc-select .mdc-select__anchor {
456 /* @noflip */
457 /*rtl:ignore*/
458 padding-left: 16px;
459 /* @noflip */
460 /*rtl:ignore*/
461 padding-right: 0;
462}
463[dir=rtl] .mdc-select .mdc-select__anchor, .mdc-select .mdc-select__anchor[dir=rtl] {
464 /*rtl:begin:ignore*/
465 /* @noflip */
466 /*rtl:ignore*/
467 padding-left: 0;
468 /* @noflip */
469 /*rtl:ignore*/
470 padding-right: 16px;
471 /*rtl:end:ignore*/
472}
473
474.mdc-select.mdc-select--with-leading-icon .mdc-select__anchor {
475 /* @noflip */
476 /*rtl:ignore*/
477 padding-left: 0;
478 /* @noflip */
479 /*rtl:ignore*/
480 padding-right: 0;
481}
482[dir=rtl] .mdc-select.mdc-select--with-leading-icon .mdc-select__anchor, .mdc-select.mdc-select--with-leading-icon .mdc-select__anchor[dir=rtl] {
483 /*rtl:begin:ignore*/
484 /* @noflip */
485 /*rtl:ignore*/
486 padding-left: 0;
487 /* @noflip */
488 /*rtl:ignore*/
489 padding-right: 0;
490 /*rtl:end:ignore*/
491}
492
493.mdc-select .mdc-select__icon {
494 width: 24px;
495 height: 24px;
496 font-size: 24px;
497}
498.mdc-select .mdc-select__dropdown-icon {
499 width: 24px;
500 height: 24px;
501}
502.mdc-select .mdc-select__menu .mdc-deprecated-list-item {
503 /* @noflip */
504 /*rtl:ignore*/
505 padding-left: 16px;
506 /* @noflip */
507 /*rtl:ignore*/
508 padding-right: 16px;
509}
510[dir=rtl] .mdc-select .mdc-select__menu .mdc-deprecated-list-item, .mdc-select .mdc-select__menu .mdc-deprecated-list-item[dir=rtl] {
511 /*rtl:begin:ignore*/
512 /* @noflip */
513 /*rtl:ignore*/
514 padding-left: 16px;
515 /* @noflip */
516 /*rtl:ignore*/
517 padding-right: 16px;
518 /*rtl:end:ignore*/
519}
520
521.mdc-select .mdc-select__menu .mdc-deprecated-list-item__graphic {
522 /* @noflip */
523 /*rtl:ignore*/
524 margin-left: 0;
525 /* @noflip */
526 /*rtl:ignore*/
527 margin-right: 12px;
528}
529[dir=rtl] .mdc-select .mdc-select__menu .mdc-deprecated-list-item__graphic, .mdc-select .mdc-select__menu .mdc-deprecated-list-item__graphic[dir=rtl] {
530 /*rtl:begin:ignore*/
531 /* @noflip */
532 /*rtl:ignore*/
533 margin-left: 12px;
534 /* @noflip */
535 /*rtl:ignore*/
536 margin-right: 0;
537 /*rtl:end:ignore*/
538}
539
540.mdc-select__dropdown-icon {
541 /* @noflip */
542 /*rtl:ignore*/
543 margin-left: 12px;
544 /* @noflip */
545 /*rtl:ignore*/
546 margin-right: 12px;
547 display: inline-flex;
548 position: relative;
549 align-self: center;
550 align-items: center;
551 justify-content: center;
552 flex-shrink: 0;
553 pointer-events: none;
554}
555.mdc-select__dropdown-icon .mdc-select__dropdown-icon-active,
556.mdc-select__dropdown-icon .mdc-select__dropdown-icon-inactive {
557 position: absolute;
558 top: 0;
559 left: 0;
560}
561.mdc-select__dropdown-icon .mdc-select__dropdown-icon-graphic {
562 width: 41.6666666667%;
563 height: 20.8333333333%;
564}
565.mdc-select__dropdown-icon .mdc-select__dropdown-icon-inactive {
566 opacity: 1;
567 transition: opacity 75ms linear 75ms;
568}
569.mdc-select__dropdown-icon .mdc-select__dropdown-icon-active {
570 opacity: 0;
571 transition: opacity 75ms linear;
572}
573[dir=rtl] .mdc-select__dropdown-icon, .mdc-select__dropdown-icon[dir=rtl] {
574 /*rtl:begin:ignore*/
575 /* @noflip */
576 /*rtl:ignore*/
577 margin-left: 12px;
578 /* @noflip */
579 /*rtl:ignore*/
580 margin-right: 12px;
581 /*rtl:end:ignore*/
582}
583
584.mdc-select--activated .mdc-select__dropdown-icon .mdc-select__dropdown-icon-inactive {
585 opacity: 0;
586 transition: opacity 49.5ms linear;
587}
588.mdc-select--activated .mdc-select__dropdown-icon .mdc-select__dropdown-icon-active {
589 opacity: 1;
590 transition: opacity 100.5ms linear 49.5ms;
591}
592
593.mdc-select__anchor {
594 width: 200px;
595 min-width: 0;
596 flex: 1 1 auto;
597 position: relative;
598 box-sizing: border-box;
599 overflow: hidden;
600 outline: none;
601 cursor: pointer;
602}
603.mdc-select__anchor .mdc-floating-label--float-above {
604 -webkit-transform: translateY(-106%) scale(0.75);
605 transform: translateY(-106%) scale(0.75);
606}
607
608.mdc-select__selected-text-container {
609 display: flex;
610 -webkit-appearance: none;
611 -moz-appearance: none;
612 appearance: none;
613 pointer-events: none;
614 box-sizing: border-box;
615 width: auto;
616 min-width: 0;
617 flex-grow: 1;
618 height: 28px;
619 border: none;
620 outline: none;
621 padding: 0;
622 background-color: transparent;
623 color: inherit;
624}
625
626.mdc-select__selected-text {
627 -moz-osx-font-smoothing: grayscale;
628 -webkit-font-smoothing: antialiased;
629 font-family: Roboto, sans-serif;
630 /* @alternate */
631 font-family: var(--mdc-typography-subtitle1-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));
632 font-size: 1rem;
633 /* @alternate */
634 font-size: var(--mdc-typography-subtitle1-font-size, 1rem);
635 line-height: 1.75rem;
636 /* @alternate */
637 line-height: var(--mdc-typography-subtitle1-line-height, 1.75rem);
638 font-weight: 400;
639 /* @alternate */
640 font-weight: var(--mdc-typography-subtitle1-font-weight, 400);
641 letter-spacing: 0.009375em;
642 /* @alternate */
643 letter-spacing: var(--mdc-typography-subtitle1-letter-spacing, 0.009375em);
644 text-decoration: inherit;
645 /* @alternate */
646 -webkit-text-decoration: var(--mdc-typography-subtitle1-text-decoration, inherit);
647 text-decoration: var(--mdc-typography-subtitle1-text-decoration, inherit);
648 text-transform: inherit;
649 /* @alternate */
650 text-transform: var(--mdc-typography-subtitle1-text-transform, inherit);
651 text-overflow: ellipsis;
652 white-space: nowrap;
653 overflow: hidden;
654 display: block;
655 width: 100%;
656 /* @noflip */
657 /*rtl:ignore*/
658 text-align: left;
659}
660[dir=rtl] .mdc-select__selected-text, .mdc-select__selected-text[dir=rtl] {
661 /*rtl:begin:ignore*/
662 /* @noflip */
663 /*rtl:ignore*/
664 text-align: right;
665 /*rtl:end:ignore*/
666}
667
668.mdc-select--invalid:not(.mdc-select--disabled) .mdc-floating-label {
669 color: #b00020;
670 /* @alternate */
671 color: var(--mdc-theme-error, #b00020);
672}
673.mdc-select--invalid:not(.mdc-select--disabled).mdc-select--focused .mdc-floating-label {
674 color: #b00020;
675 /* @alternate */
676 color: var(--mdc-theme-error, #b00020);
677}
678.mdc-select--invalid:not(.mdc-select--disabled).mdc-select--invalid + .mdc-select-helper-text--validation-msg {
679 color: #b00020;
680 /* @alternate */
681 color: var(--mdc-theme-error, #b00020);
682}
683.mdc-select--invalid:not(.mdc-select--disabled) .mdc-select__dropdown-icon {
684 fill: #b00020;
685 /* @alternate */
686 fill: var(--mdc-theme-error, #b00020);
687}
688.mdc-select--invalid:not(.mdc-select--disabled).mdc-select--focused .mdc-select__dropdown-icon {
689 fill: #b00020;
690 /* @alternate */
691 fill: var(--mdc-theme-error, #b00020);
692}
693.mdc-select--disabled {
694 cursor: default;
695 pointer-events: none;
696}
697
698.mdc-select--with-leading-icon .mdc-select__menu .mdc-deprecated-list-item {
699 /* @noflip */
700 /*rtl:ignore*/
701 padding-left: 12px;
702 /* @noflip */
703 /*rtl:ignore*/
704 padding-right: 12px;
705}
706[dir=rtl] .mdc-select--with-leading-icon .mdc-select__menu .mdc-deprecated-list-item, .mdc-select--with-leading-icon .mdc-select__menu .mdc-deprecated-list-item[dir=rtl] {
707 /*rtl:begin:ignore*/
708 /* @noflip */
709 /*rtl:ignore*/
710 padding-left: 12px;
711 /* @noflip */
712 /*rtl:ignore*/
713 padding-right: 12px;
714 /*rtl:end:ignore*/
715}
716
717@media screen and (forced-colors: active), (-ms-high-contrast: active) {
718 .mdc-select__menu::before {
719 position: absolute;
720 box-sizing: border-box;
721 width: 100%;
722 height: 100%;
723 top: 0;
724 left: 0;
725 border: 1px solid transparent;
726 border-radius: inherit;
727 content: "";
728 pointer-events: none;
729 }
730}
731@media screen and (forced-colors: active) and (forced-colors: active), screen and (-ms-high-contrast: active) and (forced-colors: active) {
732 .mdc-select__menu::before {
733 border-color: CanvasText;
734 }
735}
736.mdc-select__menu .mdc-deprecated-list .mdc-select__icon,
737.mdc-select__menu .mdc-list .mdc-select__icon {
738 /* @noflip */
739 /*rtl:ignore*/
740 margin-left: 0;
741 /* @noflip */
742 /*rtl:ignore*/
743 margin-right: 0;
744}
745[dir=rtl] .mdc-select__menu .mdc-deprecated-list .mdc-select__icon, [dir=rtl] .mdc-select__menu .mdc-list .mdc-select__icon, .mdc-select__menu .mdc-deprecated-list .mdc-select__icon[dir=rtl], .mdc-select__menu .mdc-list .mdc-select__icon[dir=rtl] {
746 /*rtl:begin:ignore*/
747 /* @noflip */
748 /*rtl:ignore*/
749 margin-left: 0;
750 /* @noflip */
751 /*rtl:ignore*/
752 margin-right: 0;
753 /*rtl:end:ignore*/
754}
755
756.mdc-select__menu .mdc-deprecated-list .mdc-deprecated-list-item--selected,
757.mdc-select__menu .mdc-deprecated-list .mdc-deprecated-list-item--activated,
758.mdc-select__menu .mdc-list .mdc-deprecated-list-item--selected,
759.mdc-select__menu .mdc-list .mdc-deprecated-list-item--activated {
760 color: #000;
761 /* @alternate */
762 color: var(--mdc-theme-on-surface, #000);
763}
764.mdc-select__menu .mdc-deprecated-list .mdc-deprecated-list-item--selected .mdc-deprecated-list-item__graphic,
765.mdc-select__menu .mdc-deprecated-list .mdc-deprecated-list-item--activated .mdc-deprecated-list-item__graphic,
766.mdc-select__menu .mdc-list .mdc-deprecated-list-item--selected .mdc-deprecated-list-item__graphic,
767.mdc-select__menu .mdc-list .mdc-deprecated-list-item--activated .mdc-deprecated-list-item__graphic {
768 color: #000;
769 /* @alternate */
770 color: var(--mdc-theme-on-surface, #000);
771}
772
773.mdc-select__menu .mdc-list-item__start {
774 display: inline-flex;
775 align-items: center;
776}
777
778.mdc-select__option {
779 /* @noflip */
780 /*rtl:ignore*/
781 padding-left: 16px;
782 /* @noflip */
783 /*rtl:ignore*/
784 padding-right: 16px;
785}
786[dir=rtl] .mdc-select__option, .mdc-select__option[dir=rtl] {
787 /*rtl:begin:ignore*/
788 /* @noflip */
789 /*rtl:ignore*/
790 padding-left: 16px;
791 /* @noflip */
792 /*rtl:ignore*/
793 padding-right: 16px;
794 /*rtl:end:ignore*/
795}
796
797.mdc-select__one-line-option.mdc-list-item--with-one-line {
798 height: 48px;
799}
800
801.mdc-select__two-line-option.mdc-list-item--with-two-lines {
802 height: 64px;
803}
804.mdc-select__two-line-option.mdc-list-item--with-two-lines .mdc-list-item__start {
805 margin-top: 20px;
806}
807.mdc-select__two-line-option.mdc-list-item--with-two-lines .mdc-list-item__primary-text {
808 display: block;
809 margin-top: 0;
810 /* @alternate */
811 line-height: normal;
812 margin-bottom: -20px;
813}
814.mdc-select__two-line-option.mdc-list-item--with-two-lines .mdc-list-item__primary-text::before {
815 display: inline-block;
816 width: 0;
817 height: 28px;
818 content: "";
819 vertical-align: 0;
820}
821.mdc-select__two-line-option.mdc-list-item--with-two-lines .mdc-list-item__primary-text::after {
822 display: inline-block;
823 width: 0;
824 height: 20px;
825 content: "";
826 vertical-align: -20px;
827}
828.mdc-select__two-line-option.mdc-list-item--with-two-lines.mdc-list-item--with-trailing-meta .mdc-list-item__end {
829 display: block;
830 margin-top: 0;
831 /* @alternate */
832 line-height: normal;
833}
834.mdc-select__two-line-option.mdc-list-item--with-two-lines.mdc-list-item--with-trailing-meta .mdc-list-item__end::before {
835 display: inline-block;
836 width: 0;
837 height: 36px;
838 content: "";
839 vertical-align: 0;
840}
841
842.mdc-select__option-with-leading-content {
843 /* @noflip */
844 /*rtl:ignore*/
845 padding-left: 0;
846 /* @noflip */
847 /*rtl:ignore*/
848 padding-right: 12px;
849}
850.mdc-select__option-with-leading-content.mdc-list-item {
851 /* @noflip */
852 /*rtl:ignore*/
853 padding-left: 0;
854 /* @noflip */
855 /*rtl:ignore*/
856 padding-right: auto;
857}
858[dir=rtl] .mdc-select__option-with-leading-content.mdc-list-item, .mdc-select__option-with-leading-content.mdc-list-item[dir=rtl] {
859 /*rtl:begin:ignore*/
860 /* @noflip */
861 /*rtl:ignore*/
862 padding-left: auto;
863 /* @noflip */
864 /*rtl:ignore*/
865 padding-right: 0;
866 /*rtl:end:ignore*/
867}
868
869.mdc-select__option-with-leading-content .mdc-list-item__start {
870 /* @noflip */
871 /*rtl:ignore*/
872 margin-left: 12px;
873 /* @noflip */
874 /*rtl:ignore*/
875 margin-right: 0;
876}
877[dir=rtl] .mdc-select__option-with-leading-content .mdc-list-item__start, .mdc-select__option-with-leading-content .mdc-list-item__start[dir=rtl] {
878 /*rtl:begin:ignore*/
879 /* @noflip */
880 /*rtl:ignore*/
881 margin-left: 0;
882 /* @noflip */
883 /*rtl:ignore*/
884 margin-right: 12px;
885 /*rtl:end:ignore*/
886}
887
888.mdc-select__option-with-leading-content .mdc-list-item__start {
889 width: 36px;
890 height: 24px;
891}
892[dir=rtl] .mdc-select__option-with-leading-content, .mdc-select__option-with-leading-content[dir=rtl] {
893 /*rtl:begin:ignore*/
894 /* @noflip */
895 /*rtl:ignore*/
896 padding-left: 12px;
897 /* @noflip */
898 /*rtl:ignore*/
899 padding-right: 0;
900 /*rtl:end:ignore*/
901}
902
903.mdc-select__option-with-meta.mdc-list-item {
904 /* @noflip */
905 /*rtl:ignore*/
906 padding-left: auto;
907 /* @noflip */
908 /*rtl:ignore*/
909 padding-right: 0;
910}
911[dir=rtl] .mdc-select__option-with-meta.mdc-list-item, .mdc-select__option-with-meta.mdc-list-item[dir=rtl] {
912 /*rtl:begin:ignore*/
913 /* @noflip */
914 /*rtl:ignore*/
915 padding-left: 0;
916 /* @noflip */
917 /*rtl:ignore*/
918 padding-right: auto;
919 /*rtl:end:ignore*/
920}
921
922.mdc-select__option-with-meta .mdc-list-item__end {
923 /* @noflip */
924 /*rtl:ignore*/
925 margin-left: 12px;
926 /* @noflip */
927 /*rtl:ignore*/
928 margin-right: 12px;
929}
930[dir=rtl] .mdc-select__option-with-meta .mdc-list-item__end, .mdc-select__option-with-meta .mdc-list-item__end[dir=rtl] {
931 /*rtl:begin:ignore*/
932 /* @noflip */
933 /*rtl:ignore*/
934 margin-left: 12px;
935 /* @noflip */
936 /*rtl:ignore*/
937 margin-right: 12px;
938 /*rtl:end:ignore*/
939}
940
941.mdc-select--filled .mdc-select__anchor {
942 height: 56px;
943 display: flex;
944 align-items: baseline;
945}
946.mdc-select--filled .mdc-select__anchor::before {
947 display: inline-block;
948 width: 0;
949 height: 40px;
950 content: "";
951 vertical-align: 0;
952}
953.mdc-select--filled.mdc-select--no-label .mdc-select__anchor .mdc-select__selected-text::before {
954 content: "​";
955}
956.mdc-select--filled.mdc-select--no-label .mdc-select__anchor .mdc-select__selected-text-container {
957 height: 100%;
958 display: inline-flex;
959 align-items: center;
960}
961.mdc-select--filled.mdc-select--no-label .mdc-select__anchor::before {
962 display: none;
963}
964.mdc-select--filled .mdc-select__anchor {
965 border-top-left-radius: 4px;
966 /* @alternate */
967 border-top-left-radius: var(--mdc-shape-small, 4px);
968 border-top-right-radius: 4px;
969 /* @alternate */
970 border-top-right-radius: var(--mdc-shape-small, 4px);
971 border-bottom-right-radius: 0;
972 border-bottom-left-radius: 0;
973}
974.mdc-select--filled:not(.mdc-select--disabled) .mdc-select__anchor {
975 background-color: whitesmoke;
976}
977.mdc-select--filled.mdc-select--disabled .mdc-select__anchor {
978 background-color: #fafafa;
979}
980.mdc-select--filled:not(.mdc-select--disabled) .mdc-line-ripple::before {
981 border-bottom-color: rgba(0, 0, 0, 0.42);
982}
983.mdc-select--filled:not(.mdc-select--disabled):hover .mdc-line-ripple::before {
984 border-bottom-color: rgba(0, 0, 0, 0.87);
985}
986.mdc-select--filled:not(.mdc-select--disabled) .mdc-line-ripple::after {
987 border-bottom-color: #6200ee;
988 /* @alternate */
989 border-bottom-color: var(--mdc-theme-primary, #6200ee);
990}
991.mdc-select--filled.mdc-select--disabled .mdc-line-ripple::before {
992 border-bottom-color: rgba(0, 0, 0, 0.06);
993}
994.mdc-select--filled .mdc-floating-label {
995 max-width: calc(100% - 64px);
996}
997.mdc-select--filled .mdc-floating-label--float-above {
998 max-width: calc(100% / 0.75 - 64px / 0.75);
999}
1000.mdc-select--filled .mdc-menu-surface--is-open-below {
1001 border-top-left-radius: 0px;
1002 border-top-right-radius: 0px;
1003}
1004.mdc-select--filled.mdc-select--focused.mdc-line-ripple::after {
1005 -webkit-transform: scale(1, 2);
1006 transform: scale(1, 2);
1007 opacity: 1;
1008}
1009.mdc-select--filled .mdc-floating-label {
1010 /* @noflip */
1011 /*rtl:ignore*/
1012 left: 16px;
1013 /* @noflip */
1014 /*rtl:ignore*/
1015 right: initial;
1016}
1017[dir=rtl] .mdc-select--filled .mdc-floating-label, .mdc-select--filled .mdc-floating-label[dir=rtl] {
1018 /*rtl:begin:ignore*/
1019 /* @noflip */
1020 /*rtl:ignore*/
1021 left: initial;
1022 /* @noflip */
1023 /*rtl:ignore*/
1024 right: 16px;
1025 /*rtl:end:ignore*/
1026}
1027
1028.mdc-select--filled.mdc-select--with-leading-icon .mdc-floating-label {
1029 /* @noflip */
1030 /*rtl:ignore*/
1031 left: 48px;
1032 /* @noflip */
1033 /*rtl:ignore*/
1034 right: initial;
1035}
1036[dir=rtl] .mdc-select--filled.mdc-select--with-leading-icon .mdc-floating-label, .mdc-select--filled.mdc-select--with-leading-icon .mdc-floating-label[dir=rtl] {
1037 /*rtl:begin:ignore*/
1038 /* @noflip */
1039 /*rtl:ignore*/
1040 left: initial;
1041 /* @noflip */
1042 /*rtl:ignore*/
1043 right: 48px;
1044 /*rtl:end:ignore*/
1045}
1046
1047.mdc-select--filled.mdc-select--with-leading-icon .mdc-floating-label {
1048 max-width: calc(100% - 96px);
1049}
1050.mdc-select--filled.mdc-select--with-leading-icon .mdc-floating-label--float-above {
1051 max-width: calc(100% / 0.75 - 96px / 0.75);
1052}
1053
1054.mdc-select--invalid:not(.mdc-select--disabled) .mdc-line-ripple::before {
1055 border-bottom-color: #b00020;
1056 /* @alternate */
1057 border-bottom-color: var(--mdc-theme-error, #b00020);
1058}
1059.mdc-select--invalid:not(.mdc-select--disabled):hover .mdc-line-ripple::before {
1060 border-bottom-color: #b00020;
1061 /* @alternate */
1062 border-bottom-color: var(--mdc-theme-error, #b00020);
1063}
1064.mdc-select--invalid:not(.mdc-select--disabled) .mdc-line-ripple::after {
1065 border-bottom-color: #b00020;
1066 /* @alternate */
1067 border-bottom-color: var(--mdc-theme-error, #b00020);
1068}
1069.mdc-select--outlined {
1070 border: none;
1071}
1072.mdc-select--outlined .mdc-select__anchor {
1073 height: 56px;
1074}
1075.mdc-select--outlined .mdc-select__anchor .mdc-floating-label--float-above {
1076 -webkit-transform: translateY(-37.25px) scale(1);
1077 transform: translateY(-37.25px) scale(1);
1078}
1079.mdc-select--outlined .mdc-select__anchor .mdc-floating-label--float-above {
1080 font-size: 0.75rem;
1081}
1082.mdc-select--outlined .mdc-select__anchor.mdc-notched-outline--upgraded .mdc-floating-label--float-above,
1083.mdc-select--outlined .mdc-select__anchor .mdc-notched-outline--upgraded .mdc-floating-label--float-above {
1084 -webkit-transform: translateY(-34.75px) scale(0.75);
1085 transform: translateY(-34.75px) scale(0.75);
1086}
1087.mdc-select--outlined .mdc-select__anchor.mdc-notched-outline--upgraded .mdc-floating-label--float-above,
1088.mdc-select--outlined .mdc-select__anchor .mdc-notched-outline--upgraded .mdc-floating-label--float-above {
1089 font-size: 1rem;
1090}
1091.mdc-select--outlined .mdc-select__anchor .mdc-floating-label--shake {
1092 -webkit-animation: mdc-floating-label-shake-float-above-select-outlined-56px 250ms 1;
1093 animation: mdc-floating-label-shake-float-above-select-outlined-56px 250ms 1;
1094}
1095@-webkit-keyframes mdc-floating-label-shake-float-above-select-outlined-56px {
1096 0% {
1097 /* @noflip */
1098 /*rtl:ignore*/
1099 -webkit-transform: translateX(calc(0 - 0%)) translateY(-34.75px) scale(0.75);
1100 transform: translateX(calc(0 - 0%)) translateY(-34.75px) scale(0.75);
1101 }
1102 33% {
1103 -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.701732, 0.495819);
1104 animation-timing-function: cubic-bezier(0.5, 0, 0.701732, 0.495819);
1105 /* @noflip */
1106 /*rtl:ignore*/
1107 -webkit-transform: translateX(calc(4% - 0%)) translateY(-34.75px) scale(0.75);
1108 transform: translateX(calc(4% - 0%)) translateY(-34.75px) scale(0.75);
1109 }
1110 66% {
1111 -webkit-animation-timing-function: cubic-bezier(0.302435, 0.381352, 0.55, 0.956352);
1112 animation-timing-function: cubic-bezier(0.302435, 0.381352, 0.55, 0.956352);
1113 /* @noflip */
1114 /*rtl:ignore*/
1115 -webkit-transform: translateX(calc(-4% - 0%)) translateY(-34.75px) scale(0.75);
1116 transform: translateX(calc(-4% - 0%)) translateY(-34.75px) scale(0.75);
1117 }
1118 100% {
1119 /* @noflip */
1120 /*rtl:ignore*/
1121 -webkit-transform: translateX(calc(0 - 0%)) translateY(-34.75px) scale(0.75);
1122 transform: translateX(calc(0 - 0%)) translateY(-34.75px) scale(0.75);
1123 }
1124}
1125@keyframes mdc-floating-label-shake-float-above-select-outlined-56px {
1126 0% {
1127 /* @noflip */
1128 /*rtl:ignore*/
1129 -webkit-transform: translateX(calc(0 - 0%)) translateY(-34.75px) scale(0.75);
1130 transform: translateX(calc(0 - 0%)) translateY(-34.75px) scale(0.75);
1131 }
1132 33% {
1133 -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.701732, 0.495819);
1134 animation-timing-function: cubic-bezier(0.5, 0, 0.701732, 0.495819);
1135 /* @noflip */
1136 /*rtl:ignore*/
1137 -webkit-transform: translateX(calc(4% - 0%)) translateY(-34.75px) scale(0.75);
1138 transform: translateX(calc(4% - 0%)) translateY(-34.75px) scale(0.75);
1139 }
1140 66% {
1141 -webkit-animation-timing-function: cubic-bezier(0.302435, 0.381352, 0.55, 0.956352);
1142 animation-timing-function: cubic-bezier(0.302435, 0.381352, 0.55, 0.956352);
1143 /* @noflip */
1144 /*rtl:ignore*/
1145 -webkit-transform: translateX(calc(-4% - 0%)) translateY(-34.75px) scale(0.75);
1146 transform: translateX(calc(-4% - 0%)) translateY(-34.75px) scale(0.75);
1147 }
1148 100% {
1149 /* @noflip */
1150 /*rtl:ignore*/
1151 -webkit-transform: translateX(calc(0 - 0%)) translateY(-34.75px) scale(0.75);
1152 transform: translateX(calc(0 - 0%)) translateY(-34.75px) scale(0.75);
1153 }
1154}
1155.mdc-select--outlined .mdc-notched-outline .mdc-notched-outline__leading {
1156 /* @noflip */
1157 /*rtl:ignore*/
1158 border-top-left-radius: 4px;
1159 /* @alternate */
1160 /* @noflip */
1161 /*rtl:ignore*/
1162 border-top-left-radius: var(--mdc-shape-small, 4px);
1163 /* @noflip */
1164 /*rtl:ignore*/
1165 border-top-right-radius: 0;
1166 /* @noflip */
1167 /*rtl:ignore*/
1168 border-bottom-right-radius: 0;
1169 /* @noflip */
1170 /*rtl:ignore*/
1171 border-bottom-left-radius: 4px;
1172 /* @alternate */
1173 /* @noflip */
1174 /*rtl:ignore*/
1175 border-bottom-left-radius: var(--mdc-shape-small, 4px);
1176}
1177[dir=rtl] .mdc-select--outlined .mdc-notched-outline .mdc-notched-outline__leading, .mdc-select--outlined .mdc-notched-outline .mdc-notched-outline__leading[dir=rtl] {
1178 /*rtl:begin:ignore*/
1179 /* @noflip */
1180 /*rtl:ignore*/
1181 border-top-left-radius: 0;
1182 /* @noflip */
1183 /*rtl:ignore*/
1184 border-top-right-radius: 4px;
1185 /* @alternate */
1186 /* @noflip */
1187 /*rtl:ignore*/
1188 border-top-right-radius: var(--mdc-shape-small, 4px);
1189 /* @noflip */
1190 /*rtl:ignore*/
1191 border-bottom-right-radius: 4px;
1192 /* @alternate */
1193 /* @noflip */
1194 /*rtl:ignore*/
1195 border-bottom-right-radius: var(--mdc-shape-small, 4px);
1196 /* @noflip */
1197 /*rtl:ignore*/
1198 border-bottom-left-radius: 0;
1199 /*rtl:end:ignore*/
1200}
1201
1202@supports (top: max(0%)) {
1203 .mdc-select--outlined .mdc-notched-outline .mdc-notched-outline__leading {
1204 width: max(12px, var(--mdc-shape-small, 4px));
1205 }
1206}
1207@supports (top: max(0%)) {
1208 .mdc-select--outlined .mdc-notched-outline .mdc-notched-outline__notch {
1209 max-width: calc(100% - max(12px, var(--mdc-shape-small, 4px)) * 2);
1210 }
1211}
1212.mdc-select--outlined .mdc-notched-outline .mdc-notched-outline__trailing {
1213 /* @noflip */
1214 /*rtl:ignore*/
1215 border-top-left-radius: 0;
1216 /* @noflip */
1217 /*rtl:ignore*/
1218 border-top-right-radius: 4px;
1219 /* @alternate */
1220 /* @noflip */
1221 /*rtl:ignore*/
1222 border-top-right-radius: var(--mdc-shape-small, 4px);
1223 /* @noflip */
1224 /*rtl:ignore*/
1225 border-bottom-right-radius: 4px;
1226 /* @alternate */
1227 /* @noflip */
1228 /*rtl:ignore*/
1229 border-bottom-right-radius: var(--mdc-shape-small, 4px);
1230 /* @noflip */
1231 /*rtl:ignore*/
1232 border-bottom-left-radius: 0;
1233}
1234[dir=rtl] .mdc-select--outlined .mdc-notched-outline .mdc-notched-outline__trailing, .mdc-select--outlined .mdc-notched-outline .mdc-notched-outline__trailing[dir=rtl] {
1235 /*rtl:begin:ignore*/
1236 /* @noflip */
1237 /*rtl:ignore*/
1238 border-top-left-radius: 4px;
1239 /* @alternate */
1240 /* @noflip */
1241 /*rtl:ignore*/
1242 border-top-left-radius: var(--mdc-shape-small, 4px);
1243 /* @noflip */
1244 /*rtl:ignore*/
1245 border-top-right-radius: 0;
1246 /* @noflip */
1247 /*rtl:ignore*/
1248 border-bottom-right-radius: 0;
1249 /* @noflip */
1250 /*rtl:ignore*/
1251 border-bottom-left-radius: 4px;
1252 /* @alternate */
1253 /* @noflip */
1254 /*rtl:ignore*/
1255 border-bottom-left-radius: var(--mdc-shape-small, 4px);
1256 /*rtl:end:ignore*/
1257}
1258
1259@supports (top: max(0%)) {
1260 .mdc-select--outlined .mdc-select__anchor {
1261 /* @noflip */
1262 /*rtl:ignore*/
1263 padding-left: max(16px, calc(var(--mdc-shape-small, 4px) + 4px));
1264 }
1265}
1266[dir=rtl] .mdc-select--outlined .mdc-select__anchor, .mdc-select--outlined .mdc-select__anchor[dir=rtl] {
1267 /*rtl:begin:ignore*/
1268 /* @noflip */
1269 /*rtl:ignore*/
1270 padding-left: 0;
1271 /*rtl:end:ignore*/
1272}
1273@supports (top: max(0%)) {
1274 [dir=rtl] .mdc-select--outlined .mdc-select__anchor, .mdc-select--outlined .mdc-select__anchor[dir=rtl] {
1275 /* @noflip */
1276 /*rtl:ignore*/
1277 padding-right: max(16px, calc(var(--mdc-shape-small, 4px) + 4px));
1278 }
1279}
1280
1281@supports (top: max(0%)) {
1282 .mdc-select--outlined + .mdc-select-helper-text {
1283 /* @noflip */
1284 /*rtl:ignore*/
1285 margin-left: max(16px, calc(var(--mdc-shape-small, 4px) + 4px));
1286 }
1287}
1288[dir=rtl] .mdc-select--outlined + .mdc-select-helper-text, .mdc-select--outlined + .mdc-select-helper-text[dir=rtl] {
1289 /*rtl:begin:ignore*/
1290 /* @noflip */
1291 /*rtl:ignore*/
1292 margin-left: 0;
1293 /*rtl:end:ignore*/
1294}
1295@supports (top: max(0%)) {
1296 [dir=rtl] .mdc-select--outlined + .mdc-select-helper-text, .mdc-select--outlined + .mdc-select-helper-text[dir=rtl] {
1297 /* @noflip */
1298 /*rtl:ignore*/
1299 margin-right: max(16px, calc(var(--mdc-shape-small, 4px) + 4px));
1300 }
1301}
1302
1303.mdc-select--outlined:not(.mdc-select--disabled) .mdc-select__anchor {
1304 background-color: transparent;
1305}
1306.mdc-select--outlined.mdc-select--disabled .mdc-select__anchor {
1307 background-color: transparent;
1308}
1309.mdc-select--outlined:not(.mdc-select--disabled) .mdc-notched-outline__leading,
1310.mdc-select--outlined:not(.mdc-select--disabled) .mdc-notched-outline__notch,
1311.mdc-select--outlined:not(.mdc-select--disabled) .mdc-notched-outline__trailing {
1312 border-color: rgba(0, 0, 0, 0.38);
1313}
1314.mdc-select--outlined:not(.mdc-select--disabled):not(.mdc-select--focused) .mdc-select__anchor:hover .mdc-notched-outline .mdc-notched-outline__leading,
1315.mdc-select--outlined:not(.mdc-select--disabled):not(.mdc-select--focused) .mdc-select__anchor:hover .mdc-notched-outline .mdc-notched-outline__notch,
1316.mdc-select--outlined:not(.mdc-select--disabled):not(.mdc-select--focused) .mdc-select__anchor:hover .mdc-notched-outline .mdc-notched-outline__trailing {
1317 border-color: rgba(0, 0, 0, 0.87);
1318}
1319.mdc-select--outlined:not(.mdc-select--disabled).mdc-select--focused .mdc-notched-outline .mdc-notched-outline__leading,
1320.mdc-select--outlined:not(.mdc-select--disabled).mdc-select--focused .mdc-notched-outline .mdc-notched-outline__notch,
1321.mdc-select--outlined:not(.mdc-select--disabled).mdc-select--focused .mdc-notched-outline .mdc-notched-outline__trailing {
1322 border-width: 2px;
1323}
1324.mdc-select--outlined:not(.mdc-select--disabled).mdc-select--focused .mdc-notched-outline .mdc-notched-outline__leading,
1325.mdc-select--outlined:not(.mdc-select--disabled).mdc-select--focused .mdc-notched-outline .mdc-notched-outline__notch,
1326.mdc-select--outlined:not(.mdc-select--disabled).mdc-select--focused .mdc-notched-outline .mdc-notched-outline__trailing {
1327 border-color: #6200ee;
1328 /* @alternate */
1329 border-color: var(--mdc-theme-primary, #6200ee);
1330}
1331.mdc-select--outlined.mdc-select--disabled .mdc-notched-outline__leading,
1332.mdc-select--outlined.mdc-select--disabled .mdc-notched-outline__notch,
1333.mdc-select--outlined.mdc-select--disabled .mdc-notched-outline__trailing {
1334 border-color: rgba(0, 0, 0, 0.06);
1335}
1336.mdc-select--outlined .mdc-select__anchor :not(.mdc-notched-outline--notched) .mdc-notched-outline__notch {
1337 max-width: calc(100% - 60px);
1338}
1339.mdc-select--outlined .mdc-select__anchor {
1340 display: flex;
1341 align-items: baseline;
1342 overflow: visible;
1343}
1344.mdc-select--outlined .mdc-select__anchor .mdc-floating-label--shake {
1345 -webkit-animation: mdc-floating-label-shake-float-above-select-outlined 250ms 1;
1346 animation: mdc-floating-label-shake-float-above-select-outlined 250ms 1;
1347}
1348.mdc-select--outlined .mdc-select__anchor .mdc-floating-label--float-above {
1349 -webkit-transform: translateY(-37.25px) scale(1);
1350 transform: translateY(-37.25px) scale(1);
1351}
1352.mdc-select--outlined .mdc-select__anchor .mdc-floating-label--float-above {
1353 font-size: 0.75rem;
1354}
1355.mdc-select--outlined .mdc-select__anchor.mdc-notched-outline--upgraded .mdc-floating-label--float-above,
1356.mdc-select--outlined .mdc-select__anchor .mdc-notched-outline--upgraded .mdc-floating-label--float-above {
1357 -webkit-transform: translateY(-34.75px) scale(0.75);
1358 transform: translateY(-34.75px) scale(0.75);
1359}
1360.mdc-select--outlined .mdc-select__anchor.mdc-notched-outline--upgraded .mdc-floating-label--float-above,
1361.mdc-select--outlined .mdc-select__anchor .mdc-notched-outline--upgraded .mdc-floating-label--float-above {
1362 font-size: 1rem;
1363}
1364.mdc-select--outlined .mdc-select__anchor .mdc-notched-outline--notched .mdc-notched-outline__notch {
1365 padding-top: 1px;
1366}
1367.mdc-select--outlined .mdc-select__anchor .mdc-select__selected-text::before {
1368 content: "​";
1369}
1370.mdc-select--outlined .mdc-select__anchor .mdc-select__selected-text-container {
1371 height: 100%;
1372 display: inline-flex;
1373 align-items: center;
1374}
1375.mdc-select--outlined .mdc-select__anchor::before {
1376 display: none;
1377}
1378.mdc-select--outlined .mdc-select__selected-text-container {
1379 display: flex;
1380 border: none;
1381 z-index: 1;
1382 background-color: transparent;
1383}
1384.mdc-select--outlined .mdc-select__icon {
1385 z-index: 2;
1386}
1387.mdc-select--outlined .mdc-floating-label {
1388 line-height: 1.15rem;
1389 /* @noflip */
1390 /*rtl:ignore*/
1391 left: 4px;
1392 /* @noflip */
1393 /*rtl:ignore*/
1394 right: initial;
1395}
1396[dir=rtl] .mdc-select--outlined .mdc-floating-label, .mdc-select--outlined .mdc-floating-label[dir=rtl] {
1397 /*rtl:begin:ignore*/
1398 /* @noflip */
1399 /*rtl:ignore*/
1400 left: initial;
1401 /* @noflip */
1402 /*rtl:ignore*/
1403 right: 4px;
1404 /*rtl:end:ignore*/
1405}
1406
1407.mdc-select--outlined.mdc-select--focused .mdc-notched-outline--notched .mdc-notched-outline__notch {
1408 padding-top: 2px;
1409}
1410.mdc-select--outlined.mdc-select--invalid:not(.mdc-select--disabled) .mdc-notched-outline__leading,
1411.mdc-select--outlined.mdc-select--invalid:not(.mdc-select--disabled) .mdc-notched-outline__notch,
1412.mdc-select--outlined.mdc-select--invalid:not(.mdc-select--disabled) .mdc-notched-outline__trailing {
1413 border-color: #b00020;
1414 /* @alternate */
1415 border-color: var(--mdc-theme-error, #b00020);
1416}
1417.mdc-select--outlined.mdc-select--invalid:not(.mdc-select--disabled):not(.mdc-select--focused) .mdc-select__anchor:hover .mdc-notched-outline .mdc-notched-outline__leading,
1418.mdc-select--outlined.mdc-select--invalid:not(.mdc-select--disabled):not(.mdc-select--focused) .mdc-select__anchor:hover .mdc-notched-outline .mdc-notched-outline__notch,
1419.mdc-select--outlined.mdc-select--invalid:not(.mdc-select--disabled):not(.mdc-select--focused) .mdc-select__anchor:hover .mdc-notched-outline .mdc-notched-outline__trailing {
1420 border-color: #b00020;
1421 /* @alternate */
1422 border-color: var(--mdc-theme-error, #b00020);
1423}
1424.mdc-select--outlined.mdc-select--invalid:not(.mdc-select--disabled).mdc-select--focused .mdc-notched-outline .mdc-notched-outline__leading,
1425.mdc-select--outlined.mdc-select--invalid:not(.mdc-select--disabled).mdc-select--focused .mdc-notched-outline .mdc-notched-outline__notch,
1426.mdc-select--outlined.mdc-select--invalid:not(.mdc-select--disabled).mdc-select--focused .mdc-notched-outline .mdc-notched-outline__trailing {
1427 border-width: 2px;
1428}
1429.mdc-select--outlined.mdc-select--invalid:not(.mdc-select--disabled).mdc-select--focused .mdc-notched-outline .mdc-notched-outline__leading,
1430.mdc-select--outlined.mdc-select--invalid:not(.mdc-select--disabled).mdc-select--focused .mdc-notched-outline .mdc-notched-outline__notch,
1431.mdc-select--outlined.mdc-select--invalid:not(.mdc-select--disabled).mdc-select--focused .mdc-notched-outline .mdc-notched-outline__trailing {
1432 border-color: #b00020;
1433 /* @alternate */
1434 border-color: var(--mdc-theme-error, #b00020);
1435}
1436.mdc-select--outlined.mdc-select--with-leading-icon .mdc-floating-label {
1437 /* @noflip */
1438 /*rtl:ignore*/
1439 left: 36px;
1440 /* @noflip */
1441 /*rtl:ignore*/
1442 right: initial;
1443}
1444[dir=rtl] .mdc-select--outlined.mdc-select--with-leading-icon .mdc-floating-label, .mdc-select--outlined.mdc-select--with-leading-icon .mdc-floating-label[dir=rtl] {
1445 /*rtl:begin:ignore*/
1446 /* @noflip */
1447 /*rtl:ignore*/
1448 left: initial;
1449 /* @noflip */
1450 /*rtl:ignore*/
1451 right: 36px;
1452 /*rtl:end:ignore*/
1453}
1454
1455.mdc-select--outlined.mdc-select--with-leading-icon .mdc-floating-label--float-above {
1456 /* @noflip */
1457 /*rtl:ignore*/
1458 -webkit-transform: translateY(-37.25px) translateX(-32px) scale(1);
1459 transform: translateY(-37.25px) translateX(-32px) scale(1);
1460}
1461[dir=rtl] .mdc-select--outlined.mdc-select--with-leading-icon .mdc-floating-label--float-above, .mdc-select--outlined.mdc-select--with-leading-icon .mdc-floating-label--float-above[dir=rtl] {
1462 /*rtl:begin:ignore*/
1463 /* @noflip */
1464 /*rtl:ignore*/
1465 -webkit-transform: translateY(-37.25px) translateX(32px) scale(1);
1466 transform: translateY(-37.25px) translateX(32px) scale(1);
1467 /*rtl:end:ignore*/
1468}
1469
1470.mdc-select--outlined.mdc-select--with-leading-icon .mdc-floating-label--float-above {
1471 font-size: 0.75rem;
1472}
1473.mdc-select--outlined.mdc-select--with-leading-icon.mdc-notched-outline--upgraded .mdc-floating-label--float-above,
1474.mdc-select--outlined.mdc-select--with-leading-icon .mdc-notched-outline--upgraded .mdc-floating-label--float-above {
1475 /* @noflip */
1476 /*rtl:ignore*/
1477 -webkit-transform: translateY(-34.75px) translateX(-32px) scale(0.75);
1478 transform: translateY(-34.75px) translateX(-32px) scale(0.75);
1479}
1480[dir=rtl] .mdc-select--outlined.mdc-select--with-leading-icon.mdc-notched-outline--upgraded .mdc-floating-label--float-above, [dir=rtl] .mdc-select--outlined.mdc-select--with-leading-icon .mdc-notched-outline--upgraded .mdc-floating-label--float-above, .mdc-select--outlined.mdc-select--with-leading-icon.mdc-notched-outline--upgraded .mdc-floating-label--float-above[dir=rtl], .mdc-select--outlined.mdc-select--with-leading-icon .mdc-notched-outline--upgraded .mdc-floating-label--float-above[dir=rtl] {
1481 /*rtl:begin:ignore*/
1482 /* @noflip */
1483 /*rtl:ignore*/
1484 -webkit-transform: translateY(-34.75px) translateX(32px) scale(0.75);
1485 transform: translateY(-34.75px) translateX(32px) scale(0.75);
1486 /*rtl:end:ignore*/
1487}
1488
1489.mdc-select--outlined.mdc-select--with-leading-icon.mdc-notched-outline--upgraded .mdc-floating-label--float-above,
1490.mdc-select--outlined.mdc-select--with-leading-icon .mdc-notched-outline--upgraded .mdc-floating-label--float-above {
1491 font-size: 1rem;
1492}
1493.mdc-select--outlined.mdc-select--with-leading-icon .mdc-floating-label--shake {
1494 -webkit-animation: mdc-floating-label-shake-float-above-select-outlined-leading-icon-56px 250ms 1;
1495 animation: mdc-floating-label-shake-float-above-select-outlined-leading-icon-56px 250ms 1;
1496}
1497@-webkit-keyframes mdc-floating-label-shake-float-above-select-outlined-leading-icon-56px {
1498 0% {
1499 /* @noflip */
1500 /*rtl:ignore*/
1501 -webkit-transform: translateX(calc(0 - 32px)) translateY(-34.75px) scale(0.75);
1502 transform: translateX(calc(0 - 32px)) translateY(-34.75px) scale(0.75);
1503 }
1504 33% {
1505 -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.701732, 0.495819);
1506 animation-timing-function: cubic-bezier(0.5, 0, 0.701732, 0.495819);
1507 /* @noflip */
1508 /*rtl:ignore*/
1509 -webkit-transform: translateX(calc(4% - 32px)) translateY(-34.75px) scale(0.75);
1510 transform: translateX(calc(4% - 32px)) translateY(-34.75px) scale(0.75);
1511 }
1512 66% {
1513 -webkit-animation-timing-function: cubic-bezier(0.302435, 0.381352, 0.55, 0.956352);
1514 animation-timing-function: cubic-bezier(0.302435, 0.381352, 0.55, 0.956352);
1515 /* @noflip */
1516 /*rtl:ignore*/
1517 -webkit-transform: translateX(calc(-4% - 32px)) translateY(-34.75px) scale(0.75);
1518 transform: translateX(calc(-4% - 32px)) translateY(-34.75px) scale(0.75);
1519 }
1520 100% {
1521 /* @noflip */
1522 /*rtl:ignore*/
1523 -webkit-transform: translateX(calc(0 - 32px)) translateY(-34.75px) scale(0.75);
1524 transform: translateX(calc(0 - 32px)) translateY(-34.75px) scale(0.75);
1525 }
1526}
1527@keyframes mdc-floating-label-shake-float-above-select-outlined-leading-icon-56px {
1528 0% {
1529 /* @noflip */
1530 /*rtl:ignore*/
1531 -webkit-transform: translateX(calc(0 - 32px)) translateY(-34.75px) scale(0.75);
1532 transform: translateX(calc(0 - 32px)) translateY(-34.75px) scale(0.75);
1533 }
1534 33% {
1535 -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.701732, 0.495819);
1536 animation-timing-function: cubic-bezier(0.5, 0, 0.701732, 0.495819);
1537 /* @noflip */
1538 /*rtl:ignore*/
1539 -webkit-transform: translateX(calc(4% - 32px)) translateY(-34.75px) scale(0.75);
1540 transform: translateX(calc(4% - 32px)) translateY(-34.75px) scale(0.75);
1541 }
1542 66% {
1543 -webkit-animation-timing-function: cubic-bezier(0.302435, 0.381352, 0.55, 0.956352);
1544 animation-timing-function: cubic-bezier(0.302435, 0.381352, 0.55, 0.956352);
1545 /* @noflip */
1546 /*rtl:ignore*/
1547 -webkit-transform: translateX(calc(-4% - 32px)) translateY(-34.75px) scale(0.75);
1548 transform: translateX(calc(-4% - 32px)) translateY(-34.75px) scale(0.75);
1549 }
1550 100% {
1551 /* @noflip */
1552 /*rtl:ignore*/
1553 -webkit-transform: translateX(calc(0 - 32px)) translateY(-34.75px) scale(0.75);
1554 transform: translateX(calc(0 - 32px)) translateY(-34.75px) scale(0.75);
1555 }
1556}
1557[dir=rtl] .mdc-select--outlined.mdc-select--with-leading-icon, .mdc-select--outlined.mdc-select--with-leading-icon[dir=rtl] {
1558 /*rtl:begin:ignore*/
1559 /*rtl:end:ignore*/
1560}
1561[dir=rtl] .mdc-select--outlined.mdc-select--with-leading-icon .mdc-floating-label--shake, .mdc-select--outlined.mdc-select--with-leading-icon[dir=rtl] .mdc-floating-label--shake {
1562 -webkit-animation: mdc-floating-label-shake-float-above-select-outlined-leading-icon-56px 250ms 1;
1563 animation: mdc-floating-label-shake-float-above-select-outlined-leading-icon-56px 250ms 1;
1564}
1565
1566@-webkit-keyframes mdc-floating-label-shake-float-above-select-outlined-leading-icon-56px-rtl {
1567 0% {
1568 /* @noflip */
1569 /*rtl:ignore*/
1570 -webkit-transform: translateX(calc(0 - -32px)) translateY(-34.75px) scale(0.75);
1571 transform: translateX(calc(0 - -32px)) translateY(-34.75px) scale(0.75);
1572 }
1573 33% {
1574 -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.701732, 0.495819);
1575 animation-timing-function: cubic-bezier(0.5, 0, 0.701732, 0.495819);
1576 /* @noflip */
1577 /*rtl:ignore*/
1578 -webkit-transform: translateX(calc(4% - -32px)) translateY(-34.75px) scale(0.75);
1579 transform: translateX(calc(4% - -32px)) translateY(-34.75px) scale(0.75);
1580 }
1581 66% {
1582 -webkit-animation-timing-function: cubic-bezier(0.302435, 0.381352, 0.55, 0.956352);
1583 animation-timing-function: cubic-bezier(0.302435, 0.381352, 0.55, 0.956352);
1584 /* @noflip */
1585 /*rtl:ignore*/
1586 -webkit-transform: translateX(calc(-4% - -32px)) translateY(-34.75px) scale(0.75);
1587 transform: translateX(calc(-4% - -32px)) translateY(-34.75px) scale(0.75);
1588 }
1589 100% {
1590 /* @noflip */
1591 /*rtl:ignore*/
1592 -webkit-transform: translateX(calc(0 - -32px)) translateY(-34.75px) scale(0.75);
1593 transform: translateX(calc(0 - -32px)) translateY(-34.75px) scale(0.75);
1594 }
1595}
1596
1597@keyframes mdc-floating-label-shake-float-above-select-outlined-leading-icon-56px-rtl {
1598 0% {
1599 /* @noflip */
1600 /*rtl:ignore*/
1601 -webkit-transform: translateX(calc(0 - -32px)) translateY(-34.75px) scale(0.75);
1602 transform: translateX(calc(0 - -32px)) translateY(-34.75px) scale(0.75);
1603 }
1604 33% {
1605 -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.701732, 0.495819);
1606 animation-timing-function: cubic-bezier(0.5, 0, 0.701732, 0.495819);
1607 /* @noflip */
1608 /*rtl:ignore*/
1609 -webkit-transform: translateX(calc(4% - -32px)) translateY(-34.75px) scale(0.75);
1610 transform: translateX(calc(4% - -32px)) translateY(-34.75px) scale(0.75);
1611 }
1612 66% {
1613 -webkit-animation-timing-function: cubic-bezier(0.302435, 0.381352, 0.55, 0.956352);
1614 animation-timing-function: cubic-bezier(0.302435, 0.381352, 0.55, 0.956352);
1615 /* @noflip */
1616 /*rtl:ignore*/
1617 -webkit-transform: translateX(calc(-4% - -32px)) translateY(-34.75px) scale(0.75);
1618 transform: translateX(calc(-4% - -32px)) translateY(-34.75px) scale(0.75);
1619 }
1620 100% {
1621 /* @noflip */
1622 /*rtl:ignore*/
1623 -webkit-transform: translateX(calc(0 - -32px)) translateY(-34.75px) scale(0.75);
1624 transform: translateX(calc(0 - -32px)) translateY(-34.75px) scale(0.75);
1625 }
1626}
1627.mdc-select--outlined.mdc-select--with-leading-icon .mdc-select__anchor :not(.mdc-notched-outline--notched) .mdc-notched-outline__notch {
1628 max-width: calc(100% - 96px);
1629}
1630.mdc-select--outlined .mdc-menu-surface {
1631 margin-bottom: 8px;
1632}
1633.mdc-select--outlined.mdc-select--no-label .mdc-menu-surface,
1634.mdc-select--outlined .mdc-menu-surface--is-open-below {
1635 margin-bottom: 0;
1636}
1637
1638.mdc-select__anchor {
1639 --mdc-ripple-fg-size: 0;
1640 --mdc-ripple-left: 0;
1641 --mdc-ripple-top: 0;
1642 --mdc-ripple-fg-scale: 1;
1643 --mdc-ripple-fg-translate-end: 0;
1644 --mdc-ripple-fg-translate-start: 0;
1645 -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
1646 will-change: transform, opacity;
1647}
1648.mdc-select__anchor .mdc-select__ripple::before,
1649.mdc-select__anchor .mdc-select__ripple::after {
1650 position: absolute;
1651 border-radius: 50%;
1652 opacity: 0;
1653 pointer-events: none;
1654 content: "";
1655}
1656.mdc-select__anchor .mdc-select__ripple::before {
1657 transition: opacity 15ms linear, background-color 15ms linear;
1658 z-index: 1;
1659 /* @alternate */
1660 z-index: var(--mdc-ripple-z-index, 1);
1661}
1662.mdc-select__anchor .mdc-select__ripple::after {
1663 z-index: 0;
1664 /* @alternate */
1665 z-index: var(--mdc-ripple-z-index, 0);
1666}
1667.mdc-select__anchor.mdc-ripple-upgraded .mdc-select__ripple::before {
1668 -webkit-transform: scale(var(--mdc-ripple-fg-scale, 1));
1669 transform: scale(var(--mdc-ripple-fg-scale, 1));
1670}
1671.mdc-select__anchor.mdc-ripple-upgraded .mdc-select__ripple::after {
1672 top: 0;
1673 /* @noflip */
1674 /*rtl:ignore*/
1675 left: 0;
1676 -webkit-transform: scale(0);
1677 transform: scale(0);
1678 -webkit-transform-origin: center center;
1679 transform-origin: center center;
1680}
1681.mdc-select__anchor.mdc-ripple-upgraded--unbounded .mdc-select__ripple::after {
1682 top: var(--mdc-ripple-top, 0);
1683 /* @noflip */
1684 /*rtl:ignore*/
1685 left: var(--mdc-ripple-left, 0);
1686}
1687.mdc-select__anchor.mdc-ripple-upgraded--foreground-activation .mdc-select__ripple::after {
1688 -webkit-animation: mdc-ripple-fg-radius-in 225ms forwards, mdc-ripple-fg-opacity-in 75ms forwards;
1689 animation: mdc-ripple-fg-radius-in 225ms forwards, mdc-ripple-fg-opacity-in 75ms forwards;
1690}
1691.mdc-select__anchor.mdc-ripple-upgraded--foreground-deactivation .mdc-select__ripple::after {
1692 -webkit-animation: mdc-ripple-fg-opacity-out 150ms;
1693 animation: mdc-ripple-fg-opacity-out 150ms;
1694 -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
1695 transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
1696}
1697.mdc-select__anchor .mdc-select__ripple::before,
1698.mdc-select__anchor .mdc-select__ripple::after {
1699 top: calc(50% - 100%);
1700 /* @noflip */
1701 /*rtl:ignore*/
1702 left: calc(50% - 100%);
1703 width: 200%;
1704 height: 200%;
1705}
1706.mdc-select__anchor.mdc-ripple-upgraded .mdc-select__ripple::after {
1707 width: var(--mdc-ripple-fg-size, 100%);
1708 height: var(--mdc-ripple-fg-size, 100%);
1709}
1710.mdc-select__anchor .mdc-select__ripple::before,
1711.mdc-select__anchor .mdc-select__ripple::after {
1712 background-color: rgba(0, 0, 0, 0.87);
1713 /* @alternate */
1714 background-color: var(--mdc-ripple-color, rgba(0, 0, 0, 0.87));
1715}
1716.mdc-select__anchor:hover .mdc-select__ripple::before, .mdc-select__anchor.mdc-ripple-surface--hover .mdc-select__ripple::before {
1717 opacity: 0.04;
1718 /* @alternate */
1719 opacity: var(--mdc-ripple-hover-opacity, 0.04);
1720}
1721.mdc-select__anchor.mdc-ripple-upgraded--background-focused .mdc-select__ripple::before, .mdc-select__anchor:not(.mdc-ripple-upgraded):focus .mdc-select__ripple::before {
1722 transition-duration: 75ms;
1723 opacity: 0.12;
1724 /* @alternate */
1725 opacity: var(--mdc-ripple-focus-opacity, 0.12);
1726}
1727.mdc-select__anchor .mdc-select__ripple {
1728 position: absolute;
1729 top: 0;
1730 left: 0;
1731 width: 100%;
1732 height: 100%;
1733 pointer-events: none;
1734}
1735
1736.mdc-select__menu .mdc-deprecated-list .mdc-deprecated-list-item--selected .mdc-deprecated-list-item__ripple::before, .mdc-select__menu .mdc-deprecated-list .mdc-deprecated-list-item--selected .mdc-deprecated-list-item__ripple::after {
1737 background-color: #000;
1738 /* @alternate */
1739 background-color: var(--mdc-ripple-color, var(--mdc-theme-on-surface, #000));
1740}
1741.mdc-select__menu .mdc-deprecated-list .mdc-deprecated-list-item--selected:hover .mdc-deprecated-list-item__ripple::before, .mdc-select__menu .mdc-deprecated-list .mdc-deprecated-list-item--selected.mdc-ripple-surface--hover .mdc-deprecated-list-item__ripple::before {
1742 opacity: 0.04;
1743 /* @alternate */
1744 opacity: var(--mdc-ripple-hover-opacity, 0.04);
1745}
1746.mdc-select__menu .mdc-deprecated-list .mdc-deprecated-list-item--selected.mdc-ripple-upgraded--background-focused .mdc-deprecated-list-item__ripple::before, .mdc-select__menu .mdc-deprecated-list .mdc-deprecated-list-item--selected:not(.mdc-ripple-upgraded):focus .mdc-deprecated-list-item__ripple::before {
1747 transition-duration: 75ms;
1748 opacity: 0.12;
1749 /* @alternate */
1750 opacity: var(--mdc-ripple-focus-opacity, 0.12);
1751}
1752.mdc-select__menu .mdc-deprecated-list .mdc-deprecated-list-item--selected:not(.mdc-ripple-upgraded) .mdc-deprecated-list-item__ripple::after {
1753 transition: opacity 150ms linear;
1754}
1755.mdc-select__menu .mdc-deprecated-list .mdc-deprecated-list-item--selected:not(.mdc-ripple-upgraded):active .mdc-deprecated-list-item__ripple::after {
1756 transition-duration: 75ms;
1757 opacity: 0.12;
1758 /* @alternate */
1759 opacity: var(--mdc-ripple-press-opacity, 0.12);
1760}
1761.mdc-select__menu .mdc-deprecated-list .mdc-deprecated-list-item--selected.mdc-ripple-upgraded {
1762 --mdc-ripple-fg-opacity: var(--mdc-ripple-press-opacity, 0.12);
1763}
1764.mdc-select__menu .mdc-deprecated-list .mdc-deprecated-list-item--selected .mdc-list-item__ripple::before, .mdc-select__menu .mdc-deprecated-list .mdc-deprecated-list-item--selected .mdc-list-item__ripple::after {
1765 background-color: #000;
1766 /* @alternate */
1767 background-color: var(--mdc-ripple-color, var(--mdc-theme-on-surface, #000));
1768}
1769.mdc-select__menu .mdc-deprecated-list .mdc-deprecated-list-item--selected:hover .mdc-list-item__ripple::before, .mdc-select__menu .mdc-deprecated-list .mdc-deprecated-list-item--selected.mdc-ripple-surface--hover .mdc-list-item__ripple::before {
1770 opacity: 0.04;
1771 /* @alternate */
1772 opacity: var(--mdc-ripple-hover-opacity, 0.04);
1773}
1774.mdc-select__menu .mdc-deprecated-list .mdc-deprecated-list-item--selected.mdc-ripple-upgraded--background-focused .mdc-list-item__ripple::before, .mdc-select__menu .mdc-deprecated-list .mdc-deprecated-list-item--selected:not(.mdc-ripple-upgraded):focus .mdc-list-item__ripple::before {
1775 transition-duration: 75ms;
1776 opacity: 0.12;
1777 /* @alternate */
1778 opacity: var(--mdc-ripple-focus-opacity, 0.12);
1779}
1780.mdc-select__menu .mdc-deprecated-list .mdc-deprecated-list-item--selected:not(.mdc-ripple-upgraded) .mdc-list-item__ripple::after {
1781 transition: opacity 150ms linear;
1782}
1783.mdc-select__menu .mdc-deprecated-list .mdc-deprecated-list-item--selected:not(.mdc-ripple-upgraded):active .mdc-list-item__ripple::after {
1784 transition-duration: 75ms;
1785 opacity: 0.12;
1786 /* @alternate */
1787 opacity: var(--mdc-ripple-press-opacity, 0.12);
1788}
1789.mdc-select__menu .mdc-deprecated-list .mdc-deprecated-list-item--selected.mdc-ripple-upgraded {
1790 --mdc-ripple-fg-opacity: var(--mdc-ripple-press-opacity, 0.12);
1791}
1792
1793.mdc-select-helper-text {
1794 margin: 0;
1795 /* @noflip */
1796 /*rtl:ignore*/
1797 margin-left: 16px;
1798 /* @noflip */
1799 /*rtl:ignore*/
1800 margin-right: 16px;
1801 -moz-osx-font-smoothing: grayscale;
1802 -webkit-font-smoothing: antialiased;
1803 font-family: Roboto, sans-serif;
1804 /* @alternate */
1805 font-family: var(--mdc-typography-caption-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));
1806 font-size: 0.75rem;
1807 /* @alternate */
1808 font-size: var(--mdc-typography-caption-font-size, 0.75rem);
1809 line-height: 1.25rem;
1810 /* @alternate */
1811 line-height: var(--mdc-typography-caption-line-height, 1.25rem);
1812 font-weight: 400;
1813 /* @alternate */
1814 font-weight: var(--mdc-typography-caption-font-weight, 400);
1815 letter-spacing: 0.0333333333em;
1816 /* @alternate */
1817 letter-spacing: var(--mdc-typography-caption-letter-spacing, 0.0333333333em);
1818 text-decoration: inherit;
1819 /* @alternate */
1820 -webkit-text-decoration: var(--mdc-typography-caption-text-decoration, inherit);
1821 text-decoration: var(--mdc-typography-caption-text-decoration, inherit);
1822 text-transform: inherit;
1823 /* @alternate */
1824 text-transform: var(--mdc-typography-caption-text-transform, inherit);
1825 display: block;
1826 margin-top: 0;
1827 /* @alternate */
1828 line-height: normal;
1829}
1830[dir=rtl] .mdc-select-helper-text, .mdc-select-helper-text[dir=rtl] {
1831 /*rtl:begin:ignore*/
1832 /* @noflip */
1833 /*rtl:ignore*/
1834 margin-left: 16px;
1835 /* @noflip */
1836 /*rtl:ignore*/
1837 margin-right: 16px;
1838 /*rtl:end:ignore*/
1839}
1840
1841.mdc-select-helper-text::before {
1842 display: inline-block;
1843 width: 0;
1844 height: 16px;
1845 content: "";
1846 vertical-align: 0;
1847}
1848
1849.mdc-select-helper-text--validation-msg {
1850 opacity: 0;
1851 transition: opacity 180ms cubic-bezier(0.4, 0, 0.2, 1);
1852}
1853
1854.mdc-select--invalid + .mdc-select-helper-text--validation-msg,
1855.mdc-select-helper-text--validation-msg-persistent {
1856 opacity: 1;
1857}
1858
1859.mdc-select--with-leading-icon .mdc-select__icon {
1860 display: inline-block;
1861 box-sizing: border-box;
1862 border: none;
1863 text-decoration: none;
1864 cursor: pointer;
1865 -webkit-user-select: none;
1866 -moz-user-select: none;
1867 -ms-user-select: none;
1868 user-select: none;
1869 flex-shrink: 0;
1870 align-self: center;
1871 background-color: transparent;
1872 fill: currentColor;
1873}
1874.mdc-select--with-leading-icon .mdc-select__icon {
1875 /* @noflip */
1876 /*rtl:ignore*/
1877 margin-left: 12px;
1878 /* @noflip */
1879 /*rtl:ignore*/
1880 margin-right: 12px;
1881}
1882[dir=rtl] .mdc-select--with-leading-icon .mdc-select__icon, .mdc-select--with-leading-icon .mdc-select__icon[dir=rtl] {
1883 /*rtl:begin:ignore*/
1884 /* @noflip */
1885 /*rtl:ignore*/
1886 margin-left: 12px;
1887 /* @noflip */
1888 /*rtl:ignore*/
1889 margin-right: 12px;
1890 /*rtl:end:ignore*/
1891}
1892
1893.mdc-select__icon:not([tabindex]),
1894.mdc-select__icon[tabindex="-1"] {
1895 cursor: default;
1896 pointer-events: none;
1897}
1898
1899/*# sourceMappingURL=mdc.select.css.map*/
\No newline at end of file