material-inspired-component-library 9.0.0 → 9.0.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (32) hide show
  1. package/components/dialog/index.scss +1 -1
  2. package/components/list/index.scss +4 -4
  3. package/components/menu/index.scss +2 -3
  4. package/components/select/README.md +26 -0
  5. package/components/select/index.scss +53 -0
  6. package/components/shapes/_paths.generated.scss +38 -52
  7. package/components/textfield/index.scss +2 -1
  8. package/dist/alert.css +1 -1
  9. package/dist/appbar.css +1 -1
  10. package/dist/badge.css +1 -1
  11. package/dist/button.css +1 -1
  12. package/dist/card.css +1 -1
  13. package/dist/chip.css +1 -1
  14. package/dist/datepicker.css +1 -1
  15. package/dist/dialog.css +1 -1
  16. package/dist/list.css +1 -1
  17. package/dist/menu.css +1 -1
  18. package/dist/menu.js +1 -1
  19. package/dist/micl.css +1 -1
  20. package/dist/micl.js +1 -1
  21. package/dist/navigationbar.css +1 -1
  22. package/dist/navigationrail.css +1 -1
  23. package/dist/select.css +1 -1
  24. package/dist/shapes.css +1 -1
  25. package/dist/sidesheet.css +1 -1
  26. package/dist/slider.css +1 -1
  27. package/dist/snackbar.css +1 -1
  28. package/dist/textfield.css +1 -1
  29. package/dist/textfield.js +1 -1
  30. package/dist/timepicker.css +1 -1
  31. package/package.json +2 -2
  32. package/styles/typography.scss +41 -278
package/components/textfield/index.scss CHANGED
@@ -37,7 +37,7 @@ $textfields: ':is(.micl-textfield-filled, .micl-textfield-outlined)';
37
37
  $fields: ':is(input, select, textarea)';
38
38
 
39
39
  // A text field is "populated" when its label floats.
40
- $populated: ':has(> :focus, > [data-miclvalue], > :is([type=date], [type=datetime-local], [type=month], [type=time], [type=week]), > input[value]:not([value=""], [data-miclinitialized]), > select:not([data-miclinitialized]) option:checked:not([value=""]), > textarea:not(:empty, [data-miclinitialized]))';
40
+ $populated: ':has(> :focus, > [data-miclvalue], > select[multiple], > :is([type=date], [type=datetime-local], [type=month], [type=time], [type=week]), > input[value]:not([value=""], [data-miclinitialized]), > select:not([data-miclinitialized]) option:checked:not([value=""]), > textarea:not(:empty, [data-miclinitialized]))';
41
41
 
42
42
  #{$textfields} {
43
43
  --_height: var(--md-comp-text-field-container-height, 56px);
@@ -80,6 +80,7 @@ $populated: ':has(> :focus, > [data-miclvalue], > :is([type=date], [type=datetim
80
80
 
81
81
  box-sizing: border-box;
82
82
  grid-area: textfield;
83
+ inline-size: auto;
83
84
  margin: 0;
84
85
  padding-inline:
85
86
  calc(var(--_input-space) - var(--_border, 0px) + var(--_icon-leading) + var(--_prefix))
package/dist/alert.css CHANGED
@@ -1 +1 @@
1
- :root{--md-ref-typeface-plain: Google Sans, system-ui, sans-serif;--md-ref-typeface-plain-narrow: 0;--md-ref-typeface-brand: Google Sans, system-ui, sans-serif;--md-ref-typeface-weight-regular: 400;--md-ref-typeface-weight-medium: 500;--md-ref-typeface-weight-bold: 700}:root{--md-sys-shape-corner-small: 8px}:root{--md-sys-typescale-title-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-title-medium-size: 1rem;--md-sys-typescale-title-medium-line-height: 1.5rem;--md-sys-typescale-title-medium-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-title-medium-tracking: 0.0125rem}:root{--md-sys-typescale-body-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-body-medium-size: 0.875rem;--md-sys-typescale-body-medium-line-height: 1.25rem;--md-sys-typescale-body-medium-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-body-medium-tracking: 0.0125rem}:is(.micl-alert-filled,.micl-alert-tonal,.micl-alert-outlined){box-sizing:border-box;display:flex;inline-size:100%;padding:var(--md-comp-alert-padding, 16px);column-gap:var(--md-comp-alert-space, 16px);border:none;outline:none;border-radius:var(--md-sys-shape-corner-small, 8px);background-color:var(--_background-color, transparent);color:var(--_color, inherit)}:is(.micl-alert-filled,.micl-alert-tonal,.micl-alert-outlined) .micl-alert__icon{block-size:var(--md-sys-icon-size, 24px);inline-size:var(--md-sys-icon-size, 24px);font-size:var(--md-sys-icon-size, 24px)}:is(.micl-alert-filled,.micl-alert-tonal,.micl-alert-outlined) .micl-alert__text{display:flex;flex-direction:column;row-gap:8px}:is(.micl-alert-filled,.micl-alert-tonal,.micl-alert-outlined) .micl-alert__text :is(h1,h2,h3,h4,h5,h6,.micl-heading){font-family:var(--md-sys-typescale-title-medium-font);font-size:var(--md-sys-typescale-title-medium-size);line-height:var(--md-sys-typescale-title-medium-line-height);font-weight:var(--md-sys-typescale-title-medium-weight);letter-spacing:var(--md-sys-typescale-title-medium-tracking);margin:0}:is(.micl-alert-filled,.micl-alert-tonal,.micl-alert-outlined) .micl-alert__text .micl-alert__supporting-text{font-family:var(--md-sys-typescale-body-medium-font);font-size:var(--md-sys-typescale-body-medium-size);line-height:var(--md-sys-typescale-body-medium-line-height);font-weight:var(--md-sys-typescale-body-medium-weight);letter-spacing:var(--md-sys-typescale-body-medium-tracking);margin:0}.micl-alert-filled{--_background-color: var(--md-sys-color-error);--_color: var(--md-sys-color-on-error)}.micl-alert-filled.micl-alert--primary{--_background-color: var(--md-sys-color-primary);--_color: var(--md-sys-color-on-primary)}.micl-alert-filled.micl-alert--secondary{--_background-color: var(--md-sys-color-secondary);--_color: var(--md-sys-color-on-secondary)}.micl-alert-filled.micl-alert--tertiary{--_background-color: var(--md-sys-color-tertiary);--_color: var(--md-sys-color-on-tertiary)}.micl-alert-tonal{--_background-color: var(--md-sys-color-error-container);--_color: var(--md-sys-color-on-error-container)}.micl-alert-tonal.micl-alert--primary{--_background-color: var(--md-sys-color-primary-container);--_color: var(--md-sys-color-on-primary-container)}.micl-alert-tonal.micl-alert--secondary{--_background-color: var(--md-sys-color-secondary-container);--_color: var(--md-sys-color-on-secondary-container)}.micl-alert-tonal.micl-alert--tertiary{--_background-color: var(--md-sys-color-tertiary-container);--_color: var(--md-sys-color-on-tertiary-container)}.micl-alert-outlined{--_color: var(--md-sys-color-error);border:1px solid var(--_color)}.micl-alert-outlined.micl-alert--primary{--_color: var(--md-sys-color-primary)}.micl-alert-outlined.micl-alert--secondary{--_color: var(--md-sys-color-secondary)}.micl-alert-outlined.micl-alert--tertiary{--_color: var(--md-sys-color-tertiary)}
1
+ :root{--md-ref-typeface-plain: Google Sans, system-ui, sans-serif;--md-ref-typeface-plain-narrow: 0;--md-ref-typeface-brand: Google Sans, system-ui, sans-serif;--md-ref-typeface-weight-regular: 400;--md-ref-typeface-weight-medium: 500;--md-ref-typeface-weight-bold: 700}:root{--md-sys-shape-corner-small: 8px}:root{--md-sys-typescale-title-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-title-medium-size: 1rem;--md-sys-typescale-title-medium-line-height: 1.5rem;--md-sys-typescale-title-medium-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-title-medium-tracking: 0.0125rem}:root{--md-sys-typescale-body-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-body-medium-size: 0.875rem;--md-sys-typescale-body-medium-line-height: 1.25rem;--md-sys-typescale-body-medium-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-body-medium-tracking: 0.0125rem}:is(.micl-alert-filled,.micl-alert-tonal,.micl-alert-outlined){box-sizing:border-box;display:flex;inline-size:100%;padding:var(--md-comp-alert-padding, 16px);column-gap:var(--md-comp-alert-space, 16px);border:none;outline:none;border-radius:var(--md-sys-shape-corner-small, 8px);background-color:var(--_background-color, transparent);color:var(--_color, inherit)}:is(.micl-alert-filled,.micl-alert-tonal,.micl-alert-outlined) .micl-alert__icon{block-size:var(--md-sys-icon-size, 24px);inline-size:var(--md-sys-icon-size, 24px);font-size:var(--md-sys-icon-size, 24px)}:is(.micl-alert-filled,.micl-alert-tonal,.micl-alert-outlined) .micl-alert__text{display:flex;flex-direction:column;row-gap:8px}:is(.micl-alert-filled,.micl-alert-tonal,.micl-alert-outlined) .micl-alert__text :is(h1,h2,h3,h4,h5,h6,.micl-heading){font:var(--md-sys-typescale-title-medium-weight) var(--md-sys-typescale-title-medium-size)/var(--md-sys-typescale-title-medium-line-height) var(--md-sys-typescale-title-medium-font);letter-spacing:var(--md-sys-typescale-title-medium-tracking);margin:0}:is(.micl-alert-filled,.micl-alert-tonal,.micl-alert-outlined) .micl-alert__text .micl-alert__supporting-text{font:var(--md-sys-typescale-body-medium-weight) var(--md-sys-typescale-body-medium-size)/var(--md-sys-typescale-body-medium-line-height) var(--md-sys-typescale-body-medium-font);letter-spacing:var(--md-sys-typescale-body-medium-tracking);margin:0}.micl-alert-filled{--_background-color: var(--md-sys-color-error);--_color: var(--md-sys-color-on-error)}.micl-alert-filled.micl-alert--primary{--_background-color: var(--md-sys-color-primary);--_color: var(--md-sys-color-on-primary)}.micl-alert-filled.micl-alert--secondary{--_background-color: var(--md-sys-color-secondary);--_color: var(--md-sys-color-on-secondary)}.micl-alert-filled.micl-alert--tertiary{--_background-color: var(--md-sys-color-tertiary);--_color: var(--md-sys-color-on-tertiary)}.micl-alert-tonal{--_background-color: var(--md-sys-color-error-container);--_color: var(--md-sys-color-on-error-container)}.micl-alert-tonal.micl-alert--primary{--_background-color: var(--md-sys-color-primary-container);--_color: var(--md-sys-color-on-primary-container)}.micl-alert-tonal.micl-alert--secondary{--_background-color: var(--md-sys-color-secondary-container);--_color: var(--md-sys-color-on-secondary-container)}.micl-alert-tonal.micl-alert--tertiary{--_background-color: var(--md-sys-color-tertiary-container);--_color: var(--md-sys-color-on-tertiary-container)}.micl-alert-outlined{--_color: var(--md-sys-color-error);border:1px solid var(--_color)}.micl-alert-outlined.micl-alert--primary{--_color: var(--md-sys-color-primary)}.micl-alert-outlined.micl-alert--secondary{--_color: var(--md-sys-color-secondary)}.micl-alert-outlined.micl-alert--tertiary{--_color: var(--md-sys-color-tertiary)}
package/dist/appbar.css CHANGED
@@ -1 +1 @@
1
- :root{--md-sys-shape-corner-medium: 12px}:root{--md-sys-layout-pane-spacer: 24px;--md-sys-layout-window-margin: 24px}@media(max-width: 599px){:root{--md-sys-layout-window-margin: 16px}}@media(min-width: 840px)and (max-width: 1199px){:root{--md-sys-layout-pane-fixed-width: 360px}}@media(min-width: 1200px){:root{--md-sys-layout-pane-fixed-width: 412px}}.micl-window{padding:env(safe-area-inset-top, 0px) calc(var(--md-sys-layout-window-margin) + env(safe-area-inset-right, 0px)) calc(var(--md-sys-layout-window-margin) + env(safe-area-inset-bottom, 0px)) calc(var(--md-sys-layout-window-margin) + env(safe-area-inset-left, 0px));margin:0;background-color:var(--md-sys-color-surface)}.micl-window .micl-panes .micl-appbar{margin-inline:calc(-1*var(--md-sys-layout-window-margin))}.micl-window:not(.micl-window--spatial):has(nav.micl-navigationrail) .micl-panes .micl-appbar{margin-inline-start:0}.micl-window.micl-window--spatial{--md-sys-layout-spatial-radius: calc(var(--md-sys-shape-corner-medium) + var(--md-sys-layout-window-margin));display:flex;padding-block:calc(2*var(--md-sys-layout-window-margin) + env(safe-area-inset-top, 0px)) calc(2*var(--md-sys-layout-window-margin) + env(safe-area-inset-bottom, 0px));gap:var(--md-sys-layout-window-margin)}.micl-window.micl-window--spatial .micl-navigationrail{display:flex;align-self:flex-start;block-size:inherit;min-block-size:inherit;margin:0;padding-block-end:var(--md-sys-navigationrail-top-space, 0px);border-radius:var(--md-sys-layout-spatial-radius)}.micl-window.micl-window--spatial .micl-panes{background:rgba(0,0,0,0)}.micl-window.micl-window--spatial .micl-pane{padding:0 var(--md-sys-layout-window-margin) var(--md-sys-layout-window-margin);border-radius:var(--md-sys-layout-spatial-radius);background-color:var(--md-sys-color-surface)}.micl-panes{box-sizing:border-box;display:flex;flex-direction:row;gap:var(--md-sys-comp-margin, 8px) var(--md-sys-layout-pane-spacer);background-color:inherit}.micl-panes.micl-panes--split>.micl-pane+.micl-pane{--_layout-safe-inline-end: env(safe-area-inset-right, 0px);box-sizing:border-box;flex:0 1 var(--_layout-stacked-pane-size, calc(50vw - var(--md-sys-layout-window-margin, 0px) - var(--_layout-safe-inline-end) - var(--md-sys-layout-pane-spacer) / 2))}.micl-panes.micl-panes--split>.micl-pane+.micl-pane:dir(rtl){--_layout-safe-inline-end: env(safe-area-inset-left, 0px)}.micl-panes.micl-panes--evenly .micl-pane{flex:1 1 0}.micl-pane{display:flex;flex-direction:column;flex:1 1 auto;min-inline-size:0;background-color:inherit}.micl-pane.micl-pane--fixed{flex:0 0 auto;box-sizing:border-box;inline-size:var(--_layout-stacked-pane-size, var(--md-sys-layout-pane-fixed-width, auto))}.micl-pane:has(>.micl-card-elevated,>.micl-card-filled,>.micl-card-outlined),.micl-pane>*:has(>.micl-card-elevated,>.micl-card-filled,>.micl-card-outlined){gap:var(--md-comp-card-margin, 8px)}.micl-pane>.micl-pane__columns{display:flex}.micl-pane>.micl-pane__columns:has(>.micl-pane__column>.micl-card-elevated,>.micl-pane__column>.micl-card-filled,>.micl-pane__column>.micl-card-outlined){gap:var(--md-comp-card-margin, 8px)}.micl-pane>.micl-pane__columns>.micl-pane__column{display:flex;flex-direction:column;flex:1 1 auto;min-inline-size:0;background-color:inherit}.micl-pane>.micl-pane__columns>.micl-pane__column:has(>.micl-card-elevated,>.micl-card-filled,>.micl-card-outlined){row-gap:var(--md-comp-card-margin, 8px)}.micl-pane>.micl-pane__columns>.micl-pane__column.micl-pane__column--fixed{flex:0 0 auto}.micl-pane>.micl-pane__columns.micl-pane__columns--evenly>.micl-pane__column{flex:1 1 0}@media(max-width: 599px){.micl-panes.micl-panes--stacked-to-medium{--_layout-stacked-pane-size: auto;flex-direction:column}.micl-pane.micl-pane--hidden-to-medium{display:none}.micl-pane__columns.micl-pane__columns--stacked-to-medium{flex-direction:column}}@media(max-width: 839px){.micl-panes.micl-panes--stacked-to-expanded{--_layout-stacked-pane-size: auto;flex-direction:column}.micl-pane.micl-pane--hidden-to-expanded{display:none}.micl-pane__columns.micl-pane__columns--stacked-to-expanded{flex-direction:column}}@media(max-width: 1199px){.micl-panes.micl-panes--stacked-to-large{--_layout-stacked-pane-size: auto;flex-direction:column}.micl-pane.micl-pane--hidden-to-large{display:none}.micl-pane__columns.micl-pane__columns--stacked-to-large{flex-direction:column}}@media(max-width: 1599px){.micl-panes.micl-panes--stacked-to-extralarge{--_layout-stacked-pane-size: auto;flex-direction:column}.micl-pane.micl-pane--hidden-to-extralarge{display:none}.micl-pane__columns.micl-pane__columns--stacked-to-extralarge{flex-direction:column}}:root{--md-ref-typeface-plain: Google Sans, system-ui, sans-serif;--md-ref-typeface-plain-narrow: 0;--md-ref-typeface-brand: Google Sans, system-ui, sans-serif;--md-ref-typeface-weight-regular: 400;--md-ref-typeface-weight-medium: 500;--md-ref-typeface-weight-bold: 700}body{--md-sys-elevation-level0: none}body{--md-sys-elevation-level2: rgb(from var(--md-sys-color-shadow) r g b/0.3) 0 1px 2px 0, rgb(from var(--md-sys-color-shadow) r g b/0.15) 0 2px 6px 2px}:root{--md-sys-shape-corner-none: 0px}:root{--md-sys-typescale-display-small-font: var(--md-ref-typeface-brand);--md-sys-typescale-display-small-size: 2.25rem;--md-sys-typescale-display-small-line-height: 2.75rem;--md-sys-typescale-display-small-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-display-small-tracking: 0}:root{--md-sys-typescale-headline-medium-font: var(--md-ref-typeface-brand);--md-sys-typescale-headline-medium-size: 1.75rem;--md-sys-typescale-headline-medium-line-height: 2.25rem;--md-sys-typescale-headline-medium-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-headline-medium-tracking: 0}:root{--md-sys-typescale-title-large-font: var(--md-ref-typeface-brand);--md-sys-typescale-title-large-size: 1.375rem;--md-sys-typescale-title-large-line-height: 1.75rem;--md-sys-typescale-title-large-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-title-large-tracking: 0}:root{--md-sys-typescale-title-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-title-medium-size: 1rem;--md-sys-typescale-title-medium-line-height: 1.5rem;--md-sys-typescale-title-medium-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-title-medium-tracking: 0.0125rem}:root{--md-sys-typescale-label-large-font: var(--md-ref-typeface-plain);--md-sys-typescale-label-large-size: 0.875rem;--md-sys-typescale-label-large-line-height: 1.25rem;--md-sys-typescale-label-large-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-label-large-tracking: 0.00625rem}:root{--md-sys-typescale-label-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-label-medium-size: 0.75rem;--md-sys-typescale-label-medium-line-height: 1rem;--md-sys-typescale-label-medium-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-label-medium-tracking: 0.03125rem}.micl-appbar{--_height: 64px;--_padding-block-start: 0px;--_padding-block-end: 0px;--_padding-inline: 0px;box-sizing:border-box;display:grid;grid-template-areas:"appbar-leading appbar-middle appbar-trailing" "appbar-bottom appbar-bottom appbar-bottom";grid-template-columns:0fr 1fr max-content;grid-template-rows:64px max-content;column-gap:4px;align-items:center;min-block-size:var(--_height);padding-block:var(--_padding-block-start) var(--_padding-block-end);padding-inline:var(--_padding-inline);border-start-start-radius:inherit;border-start-end-radius:inherit;background-color:var(--md-comp-app-bar-container-color, inherit);box-shadow:var(--md-sys-elevation-level0);z-index:8}.micl-appbar.micl-appbar--sticky{position:sticky;inset:unset;inset-block-start:env(safe-area-inset-top, 0px);inset-inline-start:0;animation:1ms linear alternate appbar-background;animation-timeline:scroll(root)}.micl-appbar .micl-appbar__leading{grid-area:appbar-leading;margin-inline-start:var(--md-sys-layout-window-margin)}.micl-appbar .micl-appbar__leading-icon{grid-area:appbar-leading;margin-inline-start:var(--md-sys-layout-window-margin);color:var(--md-comp-app-bar-leading-icon-color, var(--md-sys-color-on-surface))}.micl-appbar .micl-appbar__headline{display:flex;grid-area:appbar-middle;flex-direction:column;align-items:flex-start;margin:8px 0;border-radius:var(--md-sys-shape-corner-none);color:var(--md-comp-app-bar-title-color, var(--md-sys-color-on-surface))}.micl-appbar .micl-appbar__headline.micl-appbar__headline--center{align-items:center;text-align:center}.micl-appbar .micl-appbar__headline :is(h1,h2,h3,h4,h5,h6,.micl-heading){font-family:var(--md-sys-typescale-title-large-font);font-size:var(--md-sys-typescale-title-large-size);line-height:var(--md-sys-typescale-title-large-line-height);font-weight:var(--md-sys-typescale-title-large-weight);letter-spacing:var(--md-sys-typescale-title-large-tracking);margin:0}.micl-appbar .micl-appbar__headline .micl-appbar__subtitle{font-family:var(--md-sys-typescale-label-medium-font);font-size:var(--md-sys-typescale-label-medium-size);line-height:var(--md-sys-typescale-label-medium-line-height);font-weight:var(--md-sys-typescale-label-medium-weight);letter-spacing:var(--md-sys-typescale-label-medium-tracking);margin:0;color:var(--md-comp-app-bar-subtitle-color, var(--md-sys-color-on-surface-variant))}.micl-appbar .micl-appbar__trailing{grid-area:appbar-trailing;margin-inline-end:var(--md-sys-layout-window-margin)}.micl-appbar .micl-appbar__trailing-icon{grid-area:appbar-trailing;margin-inline-end:var(--md-sys-layout-window-margin);color:var(--md-comp-app-bar-trailing-icon-color, var(--md-sys-color-on-surface-variant))}.micl-appbar.micl-appbar--medium{--_height: 112px;--_padding-block-end: 12px;padding-inline-start:0}.micl-appbar.micl-appbar--medium .micl-appbar__headline{grid-area:appbar-bottom;margin:0;padding-inline-start:var(--md-sys-layout-window-margin)}.micl-appbar.micl-appbar--medium .micl-appbar__headline :is(h1,h2,h3,h4,h5,h6,.micl-heading){font-family:var(--md-sys-typescale-headline-medium-font);font-size:var(--md-sys-typescale-headline-medium-size);line-height:var(--md-sys-typescale-headline-medium-line-height);font-weight:var(--md-sys-typescale-headline-medium-weight);letter-spacing:var(--md-sys-typescale-headline-medium-tracking)}.micl-appbar.micl-appbar--medium:has(.micl-appbar__subtitle){--_height: 136px}.micl-appbar.micl-appbar--medium:has(.micl-appbar__subtitle) .micl-appbar__subtitle{font-family:var(--md-sys-typescale-label-large-font);font-size:var(--md-sys-typescale-label-large-size);line-height:var(--md-sys-typescale-label-large-line-height);font-weight:var(--md-sys-typescale-label-large-weight);letter-spacing:var(--md-sys-typescale-label-large-tracking)}.micl-appbar.micl-appbar--large{--_height: 120px;--_padding-block-end: 12px;padding-inline-start:0}.micl-appbar.micl-appbar--large .micl-appbar__headline{grid-area:appbar-bottom;margin:0;padding-inline-start:var(--md-sys-layout-window-margin)}.micl-appbar.micl-appbar--large .micl-appbar__headline :is(h1,h2,h3,h4,h5,h6,.micl-heading){font-family:var(--md-sys-typescale-display-small-font);font-size:var(--md-sys-typescale-display-small-size);line-height:var(--md-sys-typescale-display-small-line-height);font-weight:var(--md-sys-typescale-display-small-weight);letter-spacing:var(--md-sys-typescale-display-small-tracking)}.micl-appbar.micl-appbar--large:has(.micl-appbar__subtitle){--_height: 152px}.micl-appbar.micl-appbar--large:has(.micl-appbar__subtitle) .micl-appbar__subtitle{font-family:var(--md-sys-typescale-title-medium-font);font-size:var(--md-sys-typescale-title-medium-size);line-height:var(--md-sys-typescale-title-medium-line-height);font-weight:var(--md-sys-typescale-title-medium-weight);letter-spacing:var(--md-sys-typescale-title-medium-tracking)}.micl-panes:not(:has(>.micl-pane:nth-child(2))) .micl-appbar:not(.micl-appbar--not-sticky){position:sticky;inset:unset;inset-block-start:env(safe-area-inset-top, 0px);inset-inline-start:0;animation:1ms linear alternate appbar-background;animation-timeline:scroll(root)}@media(max-width: 600px){.micl-panes:has(>.micl-pane:nth-child(2)) .micl-appbar:not(.micl-appbar--not-sticky){position:sticky;inset:unset;inset-block-start:env(safe-area-inset-top, 0px);inset-inline-start:0;animation:1ms linear alternate appbar-background;animation-timeline:scroll(root)}}@media(min-width: 600px)and (max-width: 839px){.micl-panes:has(>.micl-pane:nth-child(2)).micl-panes--stacked-to-expanded .micl-appbar:not(.micl-appbar--not-sticky),.micl-panes:has(>.micl-pane:nth-child(2)).micl-panes--stacked-to-large .micl-appbar:not(.micl-appbar--not-sticky),.micl-panes:has(>.micl-pane:nth-child(2)).micl-panes--stacked-to-extralarge .micl-appbar:not(.micl-appbar--not-sticky){position:sticky;inset:unset;inset-block-start:env(safe-area-inset-top, 0px);inset-inline-start:0;animation:1ms linear alternate appbar-background;animation-timeline:scroll(root)}}@media(min-width: 840px)and (max-width: 1199px){.micl-panes:has(>.micl-pane:nth-child(2)).micl-panes--stacked-to-large .micl-appbar:not(.micl-appbar--not-sticky),.micl-panes:has(>.micl-pane:nth-child(2)).micl-panes--stacked-to-extralarge .micl-appbar:not(.micl-appbar--not-sticky){position:sticky;inset:unset;inset-block-start:env(safe-area-inset-top, 0px);inset-inline-start:0;animation:1ms linear alternate appbar-background;animation-timeline:scroll(root)}}@media(min-width: 1200px)and (max-width: 1599px){.micl-panes:has(>.micl-pane:nth-child(2)).micl-panes--stacked-to-extralarge .micl-appbar:not(.micl-appbar--not-sticky){position:sticky;inset:unset;inset-block-start:env(safe-area-inset-top, 0px);inset-inline-start:0;animation:1ms linear alternate appbar-background;animation-timeline:scroll(root)}}@keyframes appbar-background{0%{background-color:inherit;border-start-start-radius:inherit;border-start-end-radius:inherit}10%{background-color:var(--md-comp-app-bar-on-scroll-container-color, var(--md-sys-color-surface-container));box-shadow:var(--md-sys-elevation-level2)}50%{border-start-start-radius:0;border-start-end-radius:0}100%{background-color:var(--md-comp-app-bar-on-scroll-container-color, var(--md-sys-color-surface-container));box-shadow:var(--md-sys-elevation-level2);border-start-start-radius:0;border-start-end-radius:0}}
1
+ :root{--md-sys-shape-corner-medium: 12px}:root{--md-sys-layout-pane-spacer: 24px;--md-sys-layout-window-margin: 24px}@media(max-width: 599px){:root{--md-sys-layout-window-margin: 16px}}@media(min-width: 840px)and (max-width: 1199px){:root{--md-sys-layout-pane-fixed-width: 360px}}@media(min-width: 1200px){:root{--md-sys-layout-pane-fixed-width: 412px}}.micl-window{padding:env(safe-area-inset-top, 0px) calc(var(--md-sys-layout-window-margin) + env(safe-area-inset-right, 0px)) calc(var(--md-sys-layout-window-margin) + env(safe-area-inset-bottom, 0px)) calc(var(--md-sys-layout-window-margin) + env(safe-area-inset-left, 0px));margin:0;background-color:var(--md-sys-color-surface)}.micl-window .micl-panes .micl-appbar{margin-inline:calc(-1*var(--md-sys-layout-window-margin))}.micl-window:not(.micl-window--spatial):has(nav.micl-navigationrail) .micl-panes .micl-appbar{margin-inline-start:0}.micl-window.micl-window--spatial{--md-sys-layout-spatial-radius: calc(var(--md-sys-shape-corner-medium) + var(--md-sys-layout-window-margin));display:flex;padding-block:calc(2*var(--md-sys-layout-window-margin) + env(safe-area-inset-top, 0px)) calc(2*var(--md-sys-layout-window-margin) + env(safe-area-inset-bottom, 0px));gap:var(--md-sys-layout-window-margin)}.micl-window.micl-window--spatial .micl-navigationrail{display:flex;align-self:flex-start;block-size:inherit;min-block-size:inherit;margin:0;padding-block-end:var(--md-sys-navigationrail-top-space, 0px);border-radius:var(--md-sys-layout-spatial-radius)}.micl-window.micl-window--spatial .micl-panes{background:rgba(0,0,0,0)}.micl-window.micl-window--spatial .micl-pane{padding:0 var(--md-sys-layout-window-margin) var(--md-sys-layout-window-margin);border-radius:var(--md-sys-layout-spatial-radius);background-color:var(--md-sys-color-surface)}.micl-panes{box-sizing:border-box;display:flex;flex-direction:row;gap:var(--md-sys-comp-margin, 8px) var(--md-sys-layout-pane-spacer);background-color:inherit}.micl-panes.micl-panes--split>.micl-pane+.micl-pane{--_layout-safe-inline-end: env(safe-area-inset-right, 0px);box-sizing:border-box;flex:0 1 var(--_layout-stacked-pane-size, calc(50vw - var(--md-sys-layout-window-margin, 0px) - var(--_layout-safe-inline-end) - var(--md-sys-layout-pane-spacer) / 2))}.micl-panes.micl-panes--split>.micl-pane+.micl-pane:dir(rtl){--_layout-safe-inline-end: env(safe-area-inset-left, 0px)}.micl-panes.micl-panes--evenly .micl-pane{flex:1 1 0}.micl-pane{display:flex;flex-direction:column;flex:1 1 auto;min-inline-size:0;background-color:inherit}.micl-pane.micl-pane--fixed{flex:0 0 auto;box-sizing:border-box;inline-size:var(--_layout-stacked-pane-size, var(--md-sys-layout-pane-fixed-width, auto))}.micl-pane:has(>.micl-card-elevated,>.micl-card-filled,>.micl-card-outlined),.micl-pane>*:has(>.micl-card-elevated,>.micl-card-filled,>.micl-card-outlined){gap:var(--md-comp-card-margin, 8px)}.micl-pane>.micl-pane__columns{display:flex}.micl-pane>.micl-pane__columns:has(>.micl-pane__column>.micl-card-elevated,>.micl-pane__column>.micl-card-filled,>.micl-pane__column>.micl-card-outlined){gap:var(--md-comp-card-margin, 8px)}.micl-pane>.micl-pane__columns>.micl-pane__column{display:flex;flex-direction:column;flex:1 1 auto;min-inline-size:0;background-color:inherit}.micl-pane>.micl-pane__columns>.micl-pane__column:has(>.micl-card-elevated,>.micl-card-filled,>.micl-card-outlined){row-gap:var(--md-comp-card-margin, 8px)}.micl-pane>.micl-pane__columns>.micl-pane__column.micl-pane__column--fixed{flex:0 0 auto}.micl-pane>.micl-pane__columns.micl-pane__columns--evenly>.micl-pane__column{flex:1 1 0}@media(max-width: 599px){.micl-panes.micl-panes--stacked-to-medium{--_layout-stacked-pane-size: auto;flex-direction:column}.micl-pane.micl-pane--hidden-to-medium{display:none}.micl-pane__columns.micl-pane__columns--stacked-to-medium{flex-direction:column}}@media(max-width: 839px){.micl-panes.micl-panes--stacked-to-expanded{--_layout-stacked-pane-size: auto;flex-direction:column}.micl-pane.micl-pane--hidden-to-expanded{display:none}.micl-pane__columns.micl-pane__columns--stacked-to-expanded{flex-direction:column}}@media(max-width: 1199px){.micl-panes.micl-panes--stacked-to-large{--_layout-stacked-pane-size: auto;flex-direction:column}.micl-pane.micl-pane--hidden-to-large{display:none}.micl-pane__columns.micl-pane__columns--stacked-to-large{flex-direction:column}}@media(max-width: 1599px){.micl-panes.micl-panes--stacked-to-extralarge{--_layout-stacked-pane-size: auto;flex-direction:column}.micl-pane.micl-pane--hidden-to-extralarge{display:none}.micl-pane__columns.micl-pane__columns--stacked-to-extralarge{flex-direction:column}}:root{--md-ref-typeface-plain: Google Sans, system-ui, sans-serif;--md-ref-typeface-plain-narrow: 0;--md-ref-typeface-brand: Google Sans, system-ui, sans-serif;--md-ref-typeface-weight-regular: 400;--md-ref-typeface-weight-medium: 500;--md-ref-typeface-weight-bold: 700}body{--md-sys-elevation-level0: none}body{--md-sys-elevation-level2: rgb(from var(--md-sys-color-shadow) r g b/0.3) 0 1px 2px 0, rgb(from var(--md-sys-color-shadow) r g b/0.15) 0 2px 6px 2px}:root{--md-sys-shape-corner-none: 0px}:root{--md-sys-typescale-display-small-font: var(--md-ref-typeface-brand);--md-sys-typescale-display-small-size: 2.25rem;--md-sys-typescale-display-small-line-height: 2.75rem;--md-sys-typescale-display-small-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-display-small-tracking: 0}:root{--md-sys-typescale-headline-medium-font: var(--md-ref-typeface-brand);--md-sys-typescale-headline-medium-size: 1.75rem;--md-sys-typescale-headline-medium-line-height: 2.25rem;--md-sys-typescale-headline-medium-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-headline-medium-tracking: 0}:root{--md-sys-typescale-title-large-font: var(--md-ref-typeface-brand);--md-sys-typescale-title-large-size: 1.375rem;--md-sys-typescale-title-large-line-height: 1.75rem;--md-sys-typescale-title-large-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-title-large-tracking: 0}:root{--md-sys-typescale-title-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-title-medium-size: 1rem;--md-sys-typescale-title-medium-line-height: 1.5rem;--md-sys-typescale-title-medium-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-title-medium-tracking: 0.0125rem}:root{--md-sys-typescale-label-large-font: var(--md-ref-typeface-plain);--md-sys-typescale-label-large-size: 0.875rem;--md-sys-typescale-label-large-line-height: 1.25rem;--md-sys-typescale-label-large-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-label-large-tracking: 0.00625rem}:root{--md-sys-typescale-label-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-label-medium-size: 0.75rem;--md-sys-typescale-label-medium-line-height: 1rem;--md-sys-typescale-label-medium-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-label-medium-tracking: 0.03125rem}.micl-appbar{--_height: 64px;--_padding-block-start: 0px;--_padding-block-end: 0px;--_padding-inline: 0px;box-sizing:border-box;display:grid;grid-template-areas:"appbar-leading appbar-middle appbar-trailing" "appbar-bottom appbar-bottom appbar-bottom";grid-template-columns:0fr 1fr max-content;grid-template-rows:64px max-content;column-gap:4px;align-items:center;min-block-size:var(--_height);padding-block:var(--_padding-block-start) var(--_padding-block-end);padding-inline:var(--_padding-inline);border-start-start-radius:inherit;border-start-end-radius:inherit;background-color:var(--md-comp-app-bar-container-color, inherit);box-shadow:var(--md-sys-elevation-level0);z-index:8}.micl-appbar.micl-appbar--sticky{position:sticky;inset:unset;inset-block-start:env(safe-area-inset-top, 0px);inset-inline-start:0;animation:1ms linear alternate appbar-background;animation-timeline:scroll(root)}.micl-appbar .micl-appbar__leading{grid-area:appbar-leading;margin-inline-start:var(--md-sys-layout-window-margin)}.micl-appbar .micl-appbar__leading-icon{grid-area:appbar-leading;margin-inline-start:var(--md-sys-layout-window-margin);color:var(--md-comp-app-bar-leading-icon-color, var(--md-sys-color-on-surface))}.micl-appbar .micl-appbar__headline{display:flex;grid-area:appbar-middle;flex-direction:column;align-items:flex-start;margin:8px 0;border-radius:var(--md-sys-shape-corner-none);color:var(--md-comp-app-bar-title-color, var(--md-sys-color-on-surface))}.micl-appbar .micl-appbar__headline.micl-appbar__headline--center{align-items:center;text-align:center}.micl-appbar .micl-appbar__headline :is(h1,h2,h3,h4,h5,h6,.micl-heading){font:var(--md-sys-typescale-title-large-weight) var(--md-sys-typescale-title-large-size)/var(--md-sys-typescale-title-large-line-height) var(--md-sys-typescale-title-large-font);letter-spacing:var(--md-sys-typescale-title-large-tracking);margin:0}.micl-appbar .micl-appbar__headline .micl-appbar__subtitle{font:var(--md-sys-typescale-label-medium-weight) var(--md-sys-typescale-label-medium-size)/var(--md-sys-typescale-label-medium-line-height) var(--md-sys-typescale-label-medium-font);letter-spacing:var(--md-sys-typescale-label-medium-tracking);margin:0;color:var(--md-comp-app-bar-subtitle-color, var(--md-sys-color-on-surface-variant))}.micl-appbar .micl-appbar__trailing{grid-area:appbar-trailing;margin-inline-end:var(--md-sys-layout-window-margin)}.micl-appbar .micl-appbar__trailing-icon{grid-area:appbar-trailing;margin-inline-end:var(--md-sys-layout-window-margin);color:var(--md-comp-app-bar-trailing-icon-color, var(--md-sys-color-on-surface-variant))}.micl-appbar.micl-appbar--medium{--_height: 112px;--_padding-block-end: 12px;padding-inline-start:0}.micl-appbar.micl-appbar--medium .micl-appbar__headline{grid-area:appbar-bottom;margin:0;padding-inline-start:var(--md-sys-layout-window-margin)}.micl-appbar.micl-appbar--medium .micl-appbar__headline :is(h1,h2,h3,h4,h5,h6,.micl-heading){font:var(--md-sys-typescale-headline-medium-weight) var(--md-sys-typescale-headline-medium-size)/var(--md-sys-typescale-headline-medium-line-height) var(--md-sys-typescale-headline-medium-font);letter-spacing:var(--md-sys-typescale-headline-medium-tracking)}.micl-appbar.micl-appbar--medium:has(.micl-appbar__subtitle){--_height: 136px}.micl-appbar.micl-appbar--medium:has(.micl-appbar__subtitle) .micl-appbar__subtitle{font:var(--md-sys-typescale-label-large-weight) var(--md-sys-typescale-label-large-size)/var(--md-sys-typescale-label-large-line-height) var(--md-sys-typescale-label-large-font);letter-spacing:var(--md-sys-typescale-label-large-tracking)}.micl-appbar.micl-appbar--large{--_height: 120px;--_padding-block-end: 12px;padding-inline-start:0}.micl-appbar.micl-appbar--large .micl-appbar__headline{grid-area:appbar-bottom;margin:0;padding-inline-start:var(--md-sys-layout-window-margin)}.micl-appbar.micl-appbar--large .micl-appbar__headline :is(h1,h2,h3,h4,h5,h6,.micl-heading){font:var(--md-sys-typescale-display-small-weight) var(--md-sys-typescale-display-small-size)/var(--md-sys-typescale-display-small-line-height) var(--md-sys-typescale-display-small-font);letter-spacing:var(--md-sys-typescale-display-small-tracking)}.micl-appbar.micl-appbar--large:has(.micl-appbar__subtitle){--_height: 152px}.micl-appbar.micl-appbar--large:has(.micl-appbar__subtitle) .micl-appbar__subtitle{font:var(--md-sys-typescale-title-medium-weight) var(--md-sys-typescale-title-medium-size)/var(--md-sys-typescale-title-medium-line-height) var(--md-sys-typescale-title-medium-font);letter-spacing:var(--md-sys-typescale-title-medium-tracking)}.micl-panes:not(:has(>.micl-pane:nth-child(2))) .micl-appbar:not(.micl-appbar--not-sticky){position:sticky;inset:unset;inset-block-start:env(safe-area-inset-top, 0px);inset-inline-start:0;animation:1ms linear alternate appbar-background;animation-timeline:scroll(root)}@media(max-width: 600px){.micl-panes:has(>.micl-pane:nth-child(2)) .micl-appbar:not(.micl-appbar--not-sticky){position:sticky;inset:unset;inset-block-start:env(safe-area-inset-top, 0px);inset-inline-start:0;animation:1ms linear alternate appbar-background;animation-timeline:scroll(root)}}@media(min-width: 600px)and (max-width: 839px){.micl-panes:has(>.micl-pane:nth-child(2)).micl-panes--stacked-to-expanded .micl-appbar:not(.micl-appbar--not-sticky),.micl-panes:has(>.micl-pane:nth-child(2)).micl-panes--stacked-to-large .micl-appbar:not(.micl-appbar--not-sticky),.micl-panes:has(>.micl-pane:nth-child(2)).micl-panes--stacked-to-extralarge .micl-appbar:not(.micl-appbar--not-sticky){position:sticky;inset:unset;inset-block-start:env(safe-area-inset-top, 0px);inset-inline-start:0;animation:1ms linear alternate appbar-background;animation-timeline:scroll(root)}}@media(min-width: 840px)and (max-width: 1199px){.micl-panes:has(>.micl-pane:nth-child(2)).micl-panes--stacked-to-large .micl-appbar:not(.micl-appbar--not-sticky),.micl-panes:has(>.micl-pane:nth-child(2)).micl-panes--stacked-to-extralarge .micl-appbar:not(.micl-appbar--not-sticky){position:sticky;inset:unset;inset-block-start:env(safe-area-inset-top, 0px);inset-inline-start:0;animation:1ms linear alternate appbar-background;animation-timeline:scroll(root)}}@media(min-width: 1200px)and (max-width: 1599px){.micl-panes:has(>.micl-pane:nth-child(2)).micl-panes--stacked-to-extralarge .micl-appbar:not(.micl-appbar--not-sticky){position:sticky;inset:unset;inset-block-start:env(safe-area-inset-top, 0px);inset-inline-start:0;animation:1ms linear alternate appbar-background;animation-timeline:scroll(root)}}@keyframes appbar-background{0%{background-color:inherit;border-start-start-radius:inherit;border-start-end-radius:inherit}10%{background-color:var(--md-comp-app-bar-on-scroll-container-color, var(--md-sys-color-surface-container));box-shadow:var(--md-sys-elevation-level2)}50%{border-start-start-radius:0;border-start-end-radius:0}100%{background-color:var(--md-comp-app-bar-on-scroll-container-color, var(--md-sys-color-surface-container));box-shadow:var(--md-sys-elevation-level2);border-start-start-radius:0;border-start-end-radius:0}}
package/dist/badge.css CHANGED
@@ -1 +1 @@
1
- :root{--md-ref-typeface-plain: Google Sans, system-ui, sans-serif;--md-ref-typeface-plain-narrow: 0;--md-ref-typeface-brand: Google Sans, system-ui, sans-serif;--md-ref-typeface-weight-regular: 400;--md-ref-typeface-weight-medium: 500;--md-ref-typeface-weight-bold: 700}:root{--md-sys-typescale-label-small-font: var(--md-ref-typeface-plain);--md-sys-typescale-label-small-size: 0.6875rem;--md-sys-typescale-label-small-line-height: 1rem;--md-sys-typescale-label-small-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-label-small-tracking: 0.03125rem}.micl-badge{--_size: var(--md-comp-badge-size, 6px);--_large-size: var(--md-comp-badge-large-size, 16px);--_dx: var(--md-comp-badge-inline-offset, 0px);--_dy: var(--md-comp-badge-block-offset, 0px);box-sizing:border-box;position:fixed;inset:0;margin:0;overflow-x:hidden;background-color:var(--md-comp-badge-color, var(--md-sys-color-error));color:var(--md-comp-badge-large-label-text-color, var(--md-sys-color-on-error))}.micl-badge.micl-badge--small{inline-size:var(--_size);block-size:var(--_size);inset-block-start:calc(anchor(start) + var(--_dy));inset-inline-start:calc(anchor(end) - var(--_size) + var(--_dx));padding:0;border-radius:calc(var(--_size)/2)}.micl-badge:not(.micl-badge--small){font-family:var(--md-sys-typescale-label-small-font);font-size:var(--md-sys-typescale-label-small-size);line-height:var(--md-sys-typescale-label-small-line-height);font-weight:var(--md-sys-typescale-label-small-weight);letter-spacing:var(--md-sys-typescale-label-small-tracking);inline-size:fit-content;max-inline-size:34px;min-inline-size:var(--_large-size);block-size:var(--_large-size);inset-block-start:calc(anchor(start) - (var(--_large-size) - 14px) + var(--_dy));inset-inline-start:calc(anchor(end) - 12px + var(--_dx));padding-inline:var(--md-comp-badge-large-padding, 4px);border-radius:calc(var(--_large-size)/2)}@supports not (top: anchor(bottom)){.micl-badge{position:absolute;inset:0 !important;margin-block:calc(12px + var(--_dy)) auto}.micl-badge.micl-badge--small{margin-inline-start:calc(var(--md-sys-icon-size, 24px) - var(--_size) - var(--_dx))}.micl-badge:not(.micl-badge--small){margin-inline-start:calc(12px - var(--_dx))}}
1
+ :root{--md-ref-typeface-plain: Google Sans, system-ui, sans-serif;--md-ref-typeface-plain-narrow: 0;--md-ref-typeface-brand: Google Sans, system-ui, sans-serif;--md-ref-typeface-weight-regular: 400;--md-ref-typeface-weight-medium: 500;--md-ref-typeface-weight-bold: 700}:root{--md-sys-typescale-label-small-font: var(--md-ref-typeface-plain);--md-sys-typescale-label-small-size: 0.6875rem;--md-sys-typescale-label-small-line-height: 1rem;--md-sys-typescale-label-small-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-label-small-tracking: 0.03125rem}.micl-badge{--_size: var(--md-comp-badge-size, 6px);--_large-size: var(--md-comp-badge-large-size, 16px);--_dx: var(--md-comp-badge-inline-offset, 0px);--_dy: var(--md-comp-badge-block-offset, 0px);box-sizing:border-box;position:fixed;inset:0;margin:0;overflow-x:hidden;background-color:var(--md-comp-badge-color, var(--md-sys-color-error));color:var(--md-comp-badge-large-label-text-color, var(--md-sys-color-on-error))}.micl-badge.micl-badge--small{inline-size:var(--_size);block-size:var(--_size);inset-block-start:calc(anchor(start) + var(--_dy));inset-inline-start:calc(anchor(end) - var(--_size) + var(--_dx));padding:0;border-radius:calc(var(--_size)/2)}.micl-badge:not(.micl-badge--small){font:var(--md-sys-typescale-label-small-weight) var(--md-sys-typescale-label-small-size)/var(--md-sys-typescale-label-small-line-height) var(--md-sys-typescale-label-small-font);letter-spacing:var(--md-sys-typescale-label-small-tracking);inline-size:fit-content;max-inline-size:34px;min-inline-size:var(--_large-size);block-size:var(--_large-size);inset-block-start:calc(anchor(start) - (var(--_large-size) - 14px) + var(--_dy));inset-inline-start:calc(anchor(end) - 12px + var(--_dx));padding-inline:var(--md-comp-badge-large-padding, 4px);border-radius:calc(var(--_large-size)/2)}@supports not (top: anchor(bottom)){.micl-badge{position:absolute;inset:0 !important;margin-block:calc(12px + var(--_dy)) auto}.micl-badge.micl-badge--small{margin-inline-start:calc(var(--md-sys-icon-size, 24px) - var(--_size) - var(--_dx))}.micl-badge:not(.micl-badge--small){margin-inline-start:calc(12px - var(--_dx))}}
package/dist/button.css CHANGED
@@ -1 +1 @@
1
- :root{--md-ref-typeface-plain: Google Sans, system-ui, sans-serif;--md-ref-typeface-plain-narrow: 0;--md-ref-typeface-brand: Google Sans, system-ui, sans-serif;--md-ref-typeface-weight-regular: 400;--md-ref-typeface-weight-medium: 500;--md-ref-typeface-weight-bold: 700}body{--md-sys-elevation-level0: none}body{--md-sys-elevation-level1: rgb(from var(--md-sys-color-shadow) r g b/0.3) 0 1px 2px 0, rgb(from var(--md-sys-color-shadow) r g b/0.15) 0 1px 3px 1px}body{--md-sys-elevation-level2: rgb(from var(--md-sys-color-shadow) r g b/0.3) 0 1px 2px 0, rgb(from var(--md-sys-color-shadow) r g b/0.15) 0 2px 6px 2px}:root{--md-sys-state-hover-state-layer-opacity: 8%}:root{--md-sys-state-focus-state-layer-opacity: 10%}:root{--md-sys-state-pressed-state-layer-opacity: 10%}:root{--md-sys-state-disabled-state-layer-opacity: 38%}:root{--md-sys-state-focus-indicator-thickness: 3px}:root{--md-sys-state-ripple-opacity-factor: 0.6}:root{--md-sys-state-ripple-duration: 750ms}@property --statelayer-color{syntax:"<color>";initial-value:rgba(0,0,0,0);inherits:false}@property --statelayer-opacity{syntax:"<percentage>";initial-value:0%;inherits:false}@keyframes micl-ripple{from{background-size:0% 0%,100%;animation-timing-function:cubic-bezier(0.2, 0, 0, 1)}60%{background-size:1000% 1000%,100%;animation-timing-function:cubic-bezier(0.3, 0, 1, 1)}to{background-size:10000% 10000%,100%}}:root{--md-sys-typescale-label-large-font: var(--md-ref-typeface-plain);--md-sys-typescale-label-large-size: 0.875rem;--md-sys-typescale-label-large-line-height: 1.25rem;--md-sys-typescale-label-large-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-label-large-tracking: 0.00625rem}:is([class*=micl-button-text-],[class*=micl-button-elevated-],[class*=micl-button-filled-],[class*=micl-button-tonal-],[class*=micl-button-outlined-]){--md-comp-button-motion-effects: cubic-bezier(0.42, 1.67, 0.21, 0.9);--md-comp-button-motion-duration: 350ms;--micl-ripple: 1;box-sizing:border-box;position:relative;display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;padding:0;border:none;border-radius:calc(var(--micl-height)/2);background-image:radial-gradient(circle at var(--micl-x, center) var(--micl-y, center), transparent 0%, rgb(from var(--statelayer-color) r g b/calc(var(--statelayer-opacity) * var(--md-sys-state-ripple-opacity-factor))) 10%, transparent 10%),linear-gradient(rgb(from var(--statelayer-color) r g b/var(--statelayer-opacity)));background-repeat:no-repeat;background-position:var(--micl-x, center) var(--micl-y, center),0 0;background-size:0%,100%;-webkit-tap-highlight-color:rgba(0,0,0,0);cursor:pointer;transition:border-radius var(--md-comp-button-motion-duration) var(--md-comp-button-motion-effects),box-shadow var(--md-comp-button-motion-duration) var(--md-comp-button-motion-effects),background-size 0ms,--statelayer-opacity var(--md-comp-button-motion-duration) linear}:is(:disabled,:has(input:disabled,>button:disabled)):is([class*=micl-button-text-],[class*=micl-button-elevated-],[class*=micl-button-filled-],[class*=micl-button-tonal-],[class*=micl-button-outlined-]){cursor:default}:not(:disabled,:has(input:disabled,>button:disabled)):hover:is([class*=micl-button-text-],[class*=micl-button-elevated-],[class*=micl-button-filled-],[class*=micl-button-tonal-],[class*=micl-button-outlined-]){--statelayer-opacity: var(--md-sys-state-hover-state-layer-opacity, 8%)}:not(:disabled,:has(input:disabled,>button:disabled)):hover:is([class*=micl-button-text-],[class*=micl-button-elevated-],[class*=micl-button-filled-],[class*=micl-button-tonal-],[class*=micl-button-outlined-]) .micl-button__icon{font-variation-settings:"FILL" 1}:not(:disabled,:has(input:disabled,>button:disabled)):is(:focus-visible,:has(input:focus-visible)):is([class*=micl-button-text-],[class*=micl-button-elevated-],[class*=micl-button-filled-],[class*=micl-button-tonal-],[class*=micl-button-outlined-]){--statelayer-opacity: var(--md-sys-state-focus-state-layer-opacity, 10%);outline:var(--md-sys-state-focus-indicator-thickness, 3px) solid var(--md-sys-color-secondary);outline-offset:2px}:not(:disabled,:has(input:disabled,>button:disabled)):active:is([class*=micl-button-text-],[class*=micl-button-elevated-],[class*=micl-button-filled-],[class*=micl-button-tonal-],[class*=micl-button-outlined-]){--statelayer-opacity: var(--md-sys-state-pressed-state-layer-opacity, 10%)}:not(:disabled,:has(input:disabled,>button:disabled)).micl-rippling:is([class*=micl-button-text-],[class*=micl-button-elevated-],[class*=micl-button-filled-],[class*=micl-button-tonal-],[class*=micl-button-outlined-]){animation:micl-ripple calc(var(--md-sys-state-ripple-duration)*1.333)}:is([class*=micl-button-text-],[class*=micl-button-elevated-],[class*=micl-button-filled-],[class*=micl-button-tonal-],[class*=micl-button-outlined-]) .micl-button__icon{font-variation-settings:"FILL" 0;transition:font-variation-settings var(--md-comp-button-motion-duration) linear}.micl-button--toggle:not([aria-pressed=true]):is([class*=micl-button-text-],[class*=micl-button-elevated-],[class*=micl-button-filled-],[class*=micl-button-tonal-],[class*=micl-button-outlined-]) .micl-button__icon::before{content:attr(data-miclicon)}.micl-button--toggle[aria-pressed=true]:is([class*=micl-button-text-],[class*=micl-button-elevated-],[class*=micl-button-filled-],[class*=micl-button-tonal-],[class*=micl-button-outlined-]) .micl-button__icon::before{content:attr(data-micliconselected)}:is(.micl-button-text-s,.micl-button-elevated-s,.micl-button-filled-s,.micl-button-tonal-s,.micl-button-outlined-s)::before,:is(.micl-button-text-xs,.micl-button-elevated-xs,.micl-button-filled-xs,.micl-button-tonal-xs,.micl-button-outlined-xs)::before{content:"";position:absolute;block-size:var(--md-sys-target-size, 48px);inline-size:100%;min-inline-size:var(--md-sys-target-size, 48px);inset:calc((var(--micl-height) - var(--md-sys-target-size, 48px))/2) 0 0 calc((min(100%,var(--md-sys-target-size, 48px)) - var(--md-sys-target-size, 48px))/2);background-color:rgba(0,0,0,0)}:is(.micl-button-text-xs,.micl-button-elevated-xs,.micl-button-filled-xs,.micl-button-tonal-xs,.micl-button-outlined-xs){font-family:var(--md-sys-typescale-label-large-font);font-size:var(--md-sys-typescale-label-large-size);line-height:var(--md-sys-typescale-label-large-line-height);font-weight:var(--md-sys-typescale-label-large-weight);letter-spacing:var(--md-sys-typescale-label-large-tracking);--micl-width: 32px;--micl-height: 32px;min-inline-size:var(--micl-width);block-size:var(--micl-height);min-block-size:var(--micl-height);column-gap:4px;padding-inline:12px}:is(.micl-button-text-xs,.micl-button-elevated-xs,.micl-button-filled-xs,.micl-button-tonal-xs,.micl-button-outlined-xs) .micl-button__icon{font-size:20px;inline-size:20px}[class*=micl-button-elevated-]{--statelayer-color: var(--md-sys-color-primary);background-color:var(--md-comp-elevated-button-container-color, var(--md-sys-color-surface-container-low));color:var(--md-comp-elevated-button-label-text-color, var(--md-sys-color-primary));box-shadow:var(--md-comp-elevated-button-container-elevation, var(--md-sys-elevation-level1))}[class*=micl-button-elevated-]:is(:disabled,:has(input:disabled,>button:disabled)){background-color:var(--md-comp-elevated-button-disabled-container-color, rgb(from var(--md-sys-color-on-surface) r g b/var(--md-comp-elevated-button-disabled-container-opacity, 10%)));color:var(--md-comp-elevated-button-disabled-label-text-color, rgb(from var(--md-sys-color-on-surface-variant) r g b/var(--md-comp-elevated-button-disabled-label-text-opacity, 38%)));box-shadow:var(--md-sys-elevation-level0)}[class*=micl-button-elevated-]:not(:disabled,:has(input:disabled,>button:disabled)):hover:not(:active){box-shadow:var(--md-sys-elevation-level2)}[class*=micl-button-elevated-]:not(:disabled,:has(input:disabled,>button:disabled)).micl-button--toggle[aria-pressed=true]{--statelayer-color: var(--md-sys-color-on-primary);background-color:var(--md-comp-elevated-button-selected-container-color, var(--md-sys-color-primary));color:var(--md-comp-elevated-button-selected-label-text-color, var(--md-sys-color-on-primary))}[class*=micl-button-elevated-]:not(:disabled,:has(input:disabled,>button:disabled)).micl-button--toggle[aria-pressed=true] .micl-button__icon{font-variation-settings:"FILL" 1}[class*=micl-button-outlined-]{--statelayer-color: var(--md-sys-color-on-surface-variant);background-color:rgba(0,0,0,0);color:var(--md-comp-outlined-button-label-text-color, var(--md-sys-color-on-surface-variant));border:1px solid var(--md-comp-outlined-button-outline-color, var(--md-sys-color-outline-variant))}[class*=micl-button-outlined-]:is(:disabled,:has(input:disabled,>button:disabled)){background-color:rgba(0,0,0,0);color:var(--md-comp-outlined-button-disabled-label-text-color, rgb(from var(--md-sys-color-on-surface-variant) r g b/var(--md-comp-outlined-button-disabled-label-text-opacity, 38%)))}[class*=micl-button-outlined-]:is(:disabled,:has(input:disabled,>button:disabled)).micl-button--toggle[aria-pressed=true]{border:none;background-color:var(--md-comp-outlined-button-selected-disabled-container-color, rgb(from var(--md-sys-color-on-surface) r g b/var(--md-comp-outlined-button-selected-disabled-container-opacity, 10%)))}[class*=micl-button-outlined-]:not(:disabled,:has(input:disabled,>button:disabled)).micl-button--toggle[aria-pressed=true]{--statelayer-color: var(--md-sys-color-inverse-on-surface);border:none;background-color:var(--md-comp-outlined-button-selected-container-color, var(--md-sys-color-inverse-surface));color:var(--md-comp-outlined-button-selected-label-text-color, var(--md-sys-color-inverse-on-surface))}[class*=micl-button-outlined-]:not(:disabled,:has(input:disabled,>button:disabled)).micl-button--toggle[aria-pressed=true] .micl-button__icon{font-variation-settings:"FILL" 1}:root{--md-sys-shape-corner-small: 8px}:root{--md-sys-shape-corner-medium: 12px}:root{--md-sys-shape-corner-large: 16px}:root{--md-sys-shape-corner-extra-large: 28px}:root{--md-sys-typescale-headline-large-font: var(--md-ref-typeface-brand);--md-sys-typescale-headline-large-size: 2rem;--md-sys-typescale-headline-large-line-height: 2.5rem;--md-sys-typescale-headline-large-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-headline-large-tracking: 0}:root{--md-sys-typescale-headline-small-font: var(--md-ref-typeface-brand);--md-sys-typescale-headline-small-size: 1.5rem;--md-sys-typescale-headline-small-line-height: 2rem;--md-sys-typescale-headline-small-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-headline-small-tracking: 0}:root{--md-sys-typescale-title-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-title-medium-size: 1rem;--md-sys-typescale-title-medium-line-height: 1.5rem;--md-sys-typescale-title-medium-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-title-medium-tracking: 0.0125rem}:is([class*=micl-button-text-],[class*=micl-button-elevated-],[class*=micl-button-filled-],[class*=micl-button-tonal-],[class*=micl-button-outlined-]){min-inline-size:var(--micl-width);block-size:var(--micl-height);min-block-size:var(--micl-height)}:is([class*=micl-button-text-],[class*=micl-button-elevated-],[class*=micl-button-filled-],[class*=micl-button-tonal-],[class*=micl-button-outlined-]).micl-button--toggle[aria-pressed=true]{border-radius:var(--_shape-toggle)}:is([class*=micl-button-text-],[class*=micl-button-elevated-],[class*=micl-button-filled-],[class*=micl-button-tonal-],[class*=micl-button-outlined-]).micl-button--square{border-radius:var(--_shape-toggle)}:is([class*=micl-button-text-],[class*=micl-button-elevated-],[class*=micl-button-filled-],[class*=micl-button-tonal-],[class*=micl-button-outlined-]).micl-button--square.micl-button--toggle[aria-pressed=true]{border-radius:calc(var(--micl-height)/2)}:is([class*=micl-button-text-],[class*=micl-button-elevated-],[class*=micl-button-filled-],[class*=micl-button-tonal-],[class*=micl-button-outlined-]):not(:disabled,:has(input:disabled,>button:disabled)):active,:is([class*=micl-button-text-],[class*=micl-button-elevated-],[class*=micl-button-filled-],[class*=micl-button-tonal-],[class*=micl-button-outlined-]):not(:disabled,:has(input:disabled,>button:disabled)):active.micl-button--square{border-radius:var(--_shape-pressed)}:is(.micl-button-text-xs,.micl-button-elevated-xs,.micl-button-filled-xs,.micl-button-tonal-xs,.micl-button-outlined-xs){--_shape-toggle: var(--md-sys-shape-corner-medium);--_shape-pressed: var(--md-sys-shape-corner-small)}:is(.micl-button-text-s,.micl-button-elevated-s,.micl-button-filled-s,.micl-button-tonal-s,.micl-button-outlined-s){font-family:var(--md-sys-typescale-label-large-font);font-size:var(--md-sys-typescale-label-large-size);line-height:var(--md-sys-typescale-label-large-line-height);font-weight:var(--md-sys-typescale-label-large-weight);letter-spacing:var(--md-sys-typescale-label-large-tracking);--micl-width: 40px;--micl-height: 40px;--_shape-toggle: var(--md-sys-shape-corner-medium);--_shape-pressed: var(--md-sys-shape-corner-small);column-gap:8px;padding-inline:16px}:is(.micl-button-text-s,.micl-button-elevated-s,.micl-button-filled-s,.micl-button-tonal-s,.micl-button-outlined-s) .micl-button__icon{font-size:20px;inline-size:20px}:is(.micl-button-text-m,.micl-button-elevated-m,.micl-button-filled-m,.micl-button-tonal-m,.micl-button-outlined-m){font-family:var(--md-sys-typescale-title-medium-font);font-size:var(--md-sys-typescale-title-medium-size);line-height:var(--md-sys-typescale-title-medium-line-height);font-weight:var(--md-sys-typescale-title-medium-weight);letter-spacing:var(--md-sys-typescale-title-medium-tracking);--micl-width: 56px;--micl-height: 56px;--_shape-toggle: var(--md-sys-shape-corner-large);--_shape-pressed: var(--md-sys-shape-corner-medium);column-gap:8px;padding-inline:24px}:is(.micl-button-text-m,.micl-button-elevated-m,.micl-button-filled-m,.micl-button-tonal-m,.micl-button-outlined-m) .micl-button__icon{font-size:var(--md-sys-icon-size, 24px);inline-size:var(--md-sys-icon-size, 24px)}:is(.micl-button-text-l,.micl-button-elevated-l,.micl-button-filled-l,.micl-button-tonal-l,.micl-button-outlined-l){font-family:var(--md-sys-typescale-headline-small-font);font-size:var(--md-sys-typescale-headline-small-size);line-height:var(--md-sys-typescale-headline-small-line-height);font-weight:var(--md-sys-typescale-headline-small-weight);letter-spacing:var(--md-sys-typescale-headline-small-tracking);--micl-width: 96px;--micl-height: 96px;--_shape-toggle: var(--md-sys-shape-corner-extra-large);--_shape-pressed: var(--md-sys-shape-corner-large);column-gap:12px;padding-inline:48px}:is(.micl-button-text-l,.micl-button-elevated-l,.micl-button-filled-l,.micl-button-tonal-l,.micl-button-outlined-l) .micl-button__icon{font-size:32px;inline-size:32px}:is(.micl-button-text-xl,.micl-button-elevated-xl,.micl-button-filled-xl,.micl-button-tonal-xl,.micl-button-outlined-xl){font-family:var(--md-sys-typescale-headline-large-font);font-size:var(--md-sys-typescale-headline-large-size);line-height:var(--md-sys-typescale-headline-large-line-height);font-weight:var(--md-sys-typescale-headline-large-weight);letter-spacing:var(--md-sys-typescale-headline-large-tracking);--micl-width: 136px;--micl-height: 136px;--_shape-toggle: var(--md-sys-shape-corner-extra-large);--_shape-pressed: var(--md-sys-shape-corner-large);column-gap:16px;padding-inline:64px}:is(.micl-button-text-xl,.micl-button-elevated-xl,.micl-button-filled-xl,.micl-button-tonal-xl,.micl-button-outlined-xl) .micl-button__icon{font-size:40px;inline-size:40px}[class*=micl-button-text-]{--statelayer-color: var(--md-sys-color-primary);background-color:rgba(0,0,0,0);color:var(--md-comp-text-button-label-text-color, var(--md-sys-color-primary));text-decoration:none}[class*=micl-button-text-]:is(:disabled,:has(input:disabled,>button:disabled)){background-color:rgba(0,0,0,0);color:var(--md-comp-text-button-disabled-label-text-color, rgb(from var(--md-sys-color-on-surface-variant) r g b/var(--md-comp-text-button-disabled-label-text-opacity, 38%)))}[class*=micl-button-filled-]{--statelayer-color: var(--md-sys-color-on-primary);background-color:var(--md-comp-filled-button-container-color, var(--md-sys-color-primary));color:var(--md-comp-filled-button-label-text-color, var(--md-sys-color-on-primary))}[class*=micl-button-filled-]:is(:disabled,:has(input:disabled,>button:disabled)){background-color:var(--md-comp-filled-button-disabled-container-color, rgb(from var(--md-sys-color-on-surface) r g b/var(--md-comp-filled-button-disabled-container-opacity, 10%)));color:var(--md-comp-filled-button-disabled-label-text-color, rgb(from var(--md-sys-color-on-surface-variant) r g b/var(--md-comp-filled-button-disabled-label-text-opacity, 38%)))}[class*=micl-button-filled-]:not(:disabled,:has(input:disabled,>button:disabled)):hover:not(:active){box-shadow:var(--md-sys-elevation-level1)}[class*=micl-button-filled-]:not(:disabled,:has(input:disabled,>button:disabled)).micl-button--toggle[aria-pressed=true] .micl-button__icon{font-variation-settings:"FILL" 1}[class*=micl-button-filled-]:not(:disabled,:has(input:disabled,>button:disabled)).micl-button--toggle:not([aria-pressed=true]){--statelayer-color: var(--md-sys-color-on-surface-variant);background-color:var(--md-comp-filled-button-unselected-container-color, var(--md-sys-color-surface-container));color:var(--md-comp-filled-button-unselected-label-text-color, var(--md-sys-color-on-surface-variant))}[class*=micl-button-tonal-]{--statelayer-color: var(--md-sys-color-on-secondary-container);background-color:var(--md-comp-filled-tonal-button-container-color, var(--md-sys-color-secondary-container));color:var(--md-comp-filled-tonal-button-label-text-color, var(--md-sys-color-on-secondary-container))}[class*=micl-button-tonal-]:is(:disabled,:has(input:disabled,>button:disabled)){background-color:var(--md-comp-filled-tonal-button-disabled-container-color, rgb(from var(--md-sys-color-on-surface) r g b/var(--md-comp-filled-tonal-button-disabled-container-opacity, 10%)));color:var(--md-comp-filled-tonal-button-disabled-label-text-color, rgb(from var(--md-sys-color-on-surface-variant) r g b/var(--md-comp-filled-tonal-button-disabled-label-text-opacity, 38%)))}[class*=micl-button-tonal-]:not(:disabled,:has(input:disabled,>button:disabled)):hover:not(:active){box-shadow:var(--md-sys-elevation-level1)}[class*=micl-button-tonal-]:not(:disabled,:has(input:disabled,>button:disabled)).micl-button--toggle[aria-pressed=true]{--statelayer-color: var(--md-sys-color-on-secondary);background-color:var(--md-comp-filled-tonal-button-selected-container-color, var(--md-sys-color-secondary));color:var(--md-comp-filled-tonal-button-selected-label-text-color, var(--md-sys-color-on-secondary))}[class*=micl-button-tonal-]:not(:disabled,:has(input:disabled,>button:disabled)).micl-button--toggle[aria-pressed=true] .micl-button__icon{font-variation-settings:"FILL" 1}.micl-button-outlined-l{border-width:2px}.micl-button-outlined-xl{border-width:3px}
1
+ :root{--md-ref-typeface-plain: Google Sans, system-ui, sans-serif;--md-ref-typeface-plain-narrow: 0;--md-ref-typeface-brand: Google Sans, system-ui, sans-serif;--md-ref-typeface-weight-regular: 400;--md-ref-typeface-weight-medium: 500;--md-ref-typeface-weight-bold: 700}body{--md-sys-elevation-level0: none}body{--md-sys-elevation-level1: rgb(from var(--md-sys-color-shadow) r g b/0.3) 0 1px 2px 0, rgb(from var(--md-sys-color-shadow) r g b/0.15) 0 1px 3px 1px}body{--md-sys-elevation-level2: rgb(from var(--md-sys-color-shadow) r g b/0.3) 0 1px 2px 0, rgb(from var(--md-sys-color-shadow) r g b/0.15) 0 2px 6px 2px}:root{--md-sys-state-hover-state-layer-opacity: 8%}:root{--md-sys-state-focus-state-layer-opacity: 10%}:root{--md-sys-state-pressed-state-layer-opacity: 10%}:root{--md-sys-state-disabled-state-layer-opacity: 38%}:root{--md-sys-state-focus-indicator-thickness: 3px}:root{--md-sys-state-ripple-opacity-factor: 0.6}:root{--md-sys-state-ripple-duration: 750ms}@property --statelayer-color{syntax:"<color>";initial-value:rgba(0,0,0,0);inherits:false}@property --statelayer-opacity{syntax:"<percentage>";initial-value:0%;inherits:false}@keyframes micl-ripple{from{background-size:0% 0%,100%;animation-timing-function:cubic-bezier(0.2, 0, 0, 1)}60%{background-size:1000% 1000%,100%;animation-timing-function:cubic-bezier(0.3, 0, 1, 1)}to{background-size:10000% 10000%,100%}}:root{--md-sys-typescale-label-large-font: var(--md-ref-typeface-plain);--md-sys-typescale-label-large-size: 0.875rem;--md-sys-typescale-label-large-line-height: 1.25rem;--md-sys-typescale-label-large-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-label-large-tracking: 0.00625rem}:is([class*=micl-button-text-],[class*=micl-button-elevated-],[class*=micl-button-filled-],[class*=micl-button-tonal-],[class*=micl-button-outlined-]){--md-comp-button-motion-effects: cubic-bezier(0.42, 1.67, 0.21, 0.9);--md-comp-button-motion-duration: 350ms;--micl-ripple: 1;box-sizing:border-box;position:relative;display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;padding:0;border:none;border-radius:calc(var(--micl-height)/2);background-image:radial-gradient(circle at var(--micl-x, center) var(--micl-y, center), transparent 0%, rgb(from var(--statelayer-color) r g b/calc(var(--statelayer-opacity) * var(--md-sys-state-ripple-opacity-factor))) 10%, transparent 10%),linear-gradient(rgb(from var(--statelayer-color) r g b/var(--statelayer-opacity)));background-repeat:no-repeat;background-position:var(--micl-x, center) var(--micl-y, center),0 0;background-size:0%,100%;-webkit-tap-highlight-color:rgba(0,0,0,0);cursor:pointer;transition:border-radius var(--md-comp-button-motion-duration) var(--md-comp-button-motion-effects),box-shadow var(--md-comp-button-motion-duration) var(--md-comp-button-motion-effects),background-size 0ms,--statelayer-opacity var(--md-comp-button-motion-duration) linear}:is(:disabled,:has(input:disabled,>button:disabled)):is([class*=micl-button-text-],[class*=micl-button-elevated-],[class*=micl-button-filled-],[class*=micl-button-tonal-],[class*=micl-button-outlined-]){cursor:default}:not(:disabled,:has(input:disabled,>button:disabled)):hover:is([class*=micl-button-text-],[class*=micl-button-elevated-],[class*=micl-button-filled-],[class*=micl-button-tonal-],[class*=micl-button-outlined-]){--statelayer-opacity: var(--md-sys-state-hover-state-layer-opacity, 8%)}:not(:disabled,:has(input:disabled,>button:disabled)):hover:is([class*=micl-button-text-],[class*=micl-button-elevated-],[class*=micl-button-filled-],[class*=micl-button-tonal-],[class*=micl-button-outlined-]) .micl-button__icon{font-variation-settings:"FILL" 1}:not(:disabled,:has(input:disabled,>button:disabled)):is(:focus-visible,:has(input:focus-visible)):is([class*=micl-button-text-],[class*=micl-button-elevated-],[class*=micl-button-filled-],[class*=micl-button-tonal-],[class*=micl-button-outlined-]){--statelayer-opacity: var(--md-sys-state-focus-state-layer-opacity, 10%);outline:var(--md-sys-state-focus-indicator-thickness, 3px) solid var(--md-sys-color-secondary);outline-offset:2px}:not(:disabled,:has(input:disabled,>button:disabled)):active:is([class*=micl-button-text-],[class*=micl-button-elevated-],[class*=micl-button-filled-],[class*=micl-button-tonal-],[class*=micl-button-outlined-]){--statelayer-opacity: var(--md-sys-state-pressed-state-layer-opacity, 10%)}:not(:disabled,:has(input:disabled,>button:disabled)).micl-rippling:is([class*=micl-button-text-],[class*=micl-button-elevated-],[class*=micl-button-filled-],[class*=micl-button-tonal-],[class*=micl-button-outlined-]){animation:micl-ripple calc(var(--md-sys-state-ripple-duration)*1.333)}:is([class*=micl-button-text-],[class*=micl-button-elevated-],[class*=micl-button-filled-],[class*=micl-button-tonal-],[class*=micl-button-outlined-]) .micl-button__icon{font-variation-settings:"FILL" 0;transition:font-variation-settings var(--md-comp-button-motion-duration) linear}.micl-button--toggle:not([aria-pressed=true]):is([class*=micl-button-text-],[class*=micl-button-elevated-],[class*=micl-button-filled-],[class*=micl-button-tonal-],[class*=micl-button-outlined-]) .micl-button__icon::before{content:attr(data-miclicon)}.micl-button--toggle[aria-pressed=true]:is([class*=micl-button-text-],[class*=micl-button-elevated-],[class*=micl-button-filled-],[class*=micl-button-tonal-],[class*=micl-button-outlined-]) .micl-button__icon::before{content:attr(data-micliconselected)}:is(.micl-button-text-s,.micl-button-elevated-s,.micl-button-filled-s,.micl-button-tonal-s,.micl-button-outlined-s)::before,:is(.micl-button-text-xs,.micl-button-elevated-xs,.micl-button-filled-xs,.micl-button-tonal-xs,.micl-button-outlined-xs)::before{content:"";position:absolute;block-size:var(--md-sys-target-size, 48px);inline-size:100%;min-inline-size:var(--md-sys-target-size, 48px);inset:calc((var(--micl-height) - var(--md-sys-target-size, 48px))/2) 0 0 calc((min(100%,var(--md-sys-target-size, 48px)) - var(--md-sys-target-size, 48px))/2);background-color:rgba(0,0,0,0)}:is(.micl-button-text-xs,.micl-button-elevated-xs,.micl-button-filled-xs,.micl-button-tonal-xs,.micl-button-outlined-xs){font:var(--md-sys-typescale-label-large-weight) var(--md-sys-typescale-label-large-size)/var(--md-sys-typescale-label-large-line-height) var(--md-sys-typescale-label-large-font);letter-spacing:var(--md-sys-typescale-label-large-tracking);--micl-width: 32px;--micl-height: 32px;min-inline-size:var(--micl-width);block-size:var(--micl-height);min-block-size:var(--micl-height);column-gap:4px;padding-inline:12px}:is(.micl-button-text-xs,.micl-button-elevated-xs,.micl-button-filled-xs,.micl-button-tonal-xs,.micl-button-outlined-xs) .micl-button__icon{font-size:20px;inline-size:20px}[class*=micl-button-elevated-]{--statelayer-color: var(--md-sys-color-primary);background-color:var(--md-comp-elevated-button-container-color, var(--md-sys-color-surface-container-low));color:var(--md-comp-elevated-button-label-text-color, var(--md-sys-color-primary));box-shadow:var(--md-comp-elevated-button-container-elevation, var(--md-sys-elevation-level1))}[class*=micl-button-elevated-]:is(:disabled,:has(input:disabled,>button:disabled)){background-color:var(--md-comp-elevated-button-disabled-container-color, rgb(from var(--md-sys-color-on-surface) r g b/var(--md-comp-elevated-button-disabled-container-opacity, 10%)));color:var(--md-comp-elevated-button-disabled-label-text-color, rgb(from var(--md-sys-color-on-surface-variant) r g b/var(--md-comp-elevated-button-disabled-label-text-opacity, 38%)));box-shadow:var(--md-sys-elevation-level0)}[class*=micl-button-elevated-]:not(:disabled,:has(input:disabled,>button:disabled)):hover:not(:active){box-shadow:var(--md-sys-elevation-level2)}[class*=micl-button-elevated-]:not(:disabled,:has(input:disabled,>button:disabled)).micl-button--toggle[aria-pressed=true]{--statelayer-color: var(--md-sys-color-on-primary);background-color:var(--md-comp-elevated-button-selected-container-color, var(--md-sys-color-primary));color:var(--md-comp-elevated-button-selected-label-text-color, var(--md-sys-color-on-primary))}[class*=micl-button-elevated-]:not(:disabled,:has(input:disabled,>button:disabled)).micl-button--toggle[aria-pressed=true] .micl-button__icon{font-variation-settings:"FILL" 1}[class*=micl-button-outlined-]{--statelayer-color: var(--md-sys-color-on-surface-variant);background-color:rgba(0,0,0,0);color:var(--md-comp-outlined-button-label-text-color, var(--md-sys-color-on-surface-variant));border:1px solid var(--md-comp-outlined-button-outline-color, var(--md-sys-color-outline-variant))}[class*=micl-button-outlined-]:is(:disabled,:has(input:disabled,>button:disabled)){background-color:rgba(0,0,0,0);color:var(--md-comp-outlined-button-disabled-label-text-color, rgb(from var(--md-sys-color-on-surface-variant) r g b/var(--md-comp-outlined-button-disabled-label-text-opacity, 38%)))}[class*=micl-button-outlined-]:is(:disabled,:has(input:disabled,>button:disabled)).micl-button--toggle[aria-pressed=true]{border:none;background-color:var(--md-comp-outlined-button-selected-disabled-container-color, rgb(from var(--md-sys-color-on-surface) r g b/var(--md-comp-outlined-button-selected-disabled-container-opacity, 10%)))}[class*=micl-button-outlined-]:not(:disabled,:has(input:disabled,>button:disabled)).micl-button--toggle[aria-pressed=true]{--statelayer-color: var(--md-sys-color-inverse-on-surface);border:none;background-color:var(--md-comp-outlined-button-selected-container-color, var(--md-sys-color-inverse-surface));color:var(--md-comp-outlined-button-selected-label-text-color, var(--md-sys-color-inverse-on-surface))}[class*=micl-button-outlined-]:not(:disabled,:has(input:disabled,>button:disabled)).micl-button--toggle[aria-pressed=true] .micl-button__icon{font-variation-settings:"FILL" 1}:root{--md-sys-shape-corner-small: 8px}:root{--md-sys-shape-corner-medium: 12px}:root{--md-sys-shape-corner-large: 16px}:root{--md-sys-shape-corner-extra-large: 28px}:root{--md-sys-typescale-headline-large-font: var(--md-ref-typeface-brand);--md-sys-typescale-headline-large-size: 2rem;--md-sys-typescale-headline-large-line-height: 2.5rem;--md-sys-typescale-headline-large-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-headline-large-tracking: 0}:root{--md-sys-typescale-headline-small-font: var(--md-ref-typeface-brand);--md-sys-typescale-headline-small-size: 1.5rem;--md-sys-typescale-headline-small-line-height: 2rem;--md-sys-typescale-headline-small-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-headline-small-tracking: 0}:root{--md-sys-typescale-title-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-title-medium-size: 1rem;--md-sys-typescale-title-medium-line-height: 1.5rem;--md-sys-typescale-title-medium-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-title-medium-tracking: 0.0125rem}:is([class*=micl-button-text-],[class*=micl-button-elevated-],[class*=micl-button-filled-],[class*=micl-button-tonal-],[class*=micl-button-outlined-]){min-inline-size:var(--micl-width);block-size:var(--micl-height);min-block-size:var(--micl-height)}:is([class*=micl-button-text-],[class*=micl-button-elevated-],[class*=micl-button-filled-],[class*=micl-button-tonal-],[class*=micl-button-outlined-]).micl-button--toggle[aria-pressed=true]{border-radius:var(--_shape-toggle)}:is([class*=micl-button-text-],[class*=micl-button-elevated-],[class*=micl-button-filled-],[class*=micl-button-tonal-],[class*=micl-button-outlined-]).micl-button--square{border-radius:var(--_shape-toggle)}:is([class*=micl-button-text-],[class*=micl-button-elevated-],[class*=micl-button-filled-],[class*=micl-button-tonal-],[class*=micl-button-outlined-]).micl-button--square.micl-button--toggle[aria-pressed=true]{border-radius:calc(var(--micl-height)/2)}:is([class*=micl-button-text-],[class*=micl-button-elevated-],[class*=micl-button-filled-],[class*=micl-button-tonal-],[class*=micl-button-outlined-]):not(:disabled,:has(input:disabled,>button:disabled)):active,:is([class*=micl-button-text-],[class*=micl-button-elevated-],[class*=micl-button-filled-],[class*=micl-button-tonal-],[class*=micl-button-outlined-]):not(:disabled,:has(input:disabled,>button:disabled)):active.micl-button--square{border-radius:var(--_shape-pressed)}:is(.micl-button-text-xs,.micl-button-elevated-xs,.micl-button-filled-xs,.micl-button-tonal-xs,.micl-button-outlined-xs){--_shape-toggle: var(--md-sys-shape-corner-medium);--_shape-pressed: var(--md-sys-shape-corner-small)}:is(.micl-button-text-s,.micl-button-elevated-s,.micl-button-filled-s,.micl-button-tonal-s,.micl-button-outlined-s){font:var(--md-sys-typescale-label-large-weight) var(--md-sys-typescale-label-large-size)/var(--md-sys-typescale-label-large-line-height) var(--md-sys-typescale-label-large-font);letter-spacing:var(--md-sys-typescale-label-large-tracking);--micl-width: 40px;--micl-height: 40px;--_shape-toggle: var(--md-sys-shape-corner-medium);--_shape-pressed: var(--md-sys-shape-corner-small);column-gap:8px;padding-inline:16px}:is(.micl-button-text-s,.micl-button-elevated-s,.micl-button-filled-s,.micl-button-tonal-s,.micl-button-outlined-s) .micl-button__icon{font-size:20px;inline-size:20px}:is(.micl-button-text-m,.micl-button-elevated-m,.micl-button-filled-m,.micl-button-tonal-m,.micl-button-outlined-m){font:var(--md-sys-typescale-title-medium-weight) var(--md-sys-typescale-title-medium-size)/var(--md-sys-typescale-title-medium-line-height) var(--md-sys-typescale-title-medium-font);letter-spacing:var(--md-sys-typescale-title-medium-tracking);--micl-width: 56px;--micl-height: 56px;--_shape-toggle: var(--md-sys-shape-corner-large);--_shape-pressed: var(--md-sys-shape-corner-medium);column-gap:8px;padding-inline:24px}:is(.micl-button-text-m,.micl-button-elevated-m,.micl-button-filled-m,.micl-button-tonal-m,.micl-button-outlined-m) .micl-button__icon{font-size:var(--md-sys-icon-size, 24px);inline-size:var(--md-sys-icon-size, 24px)}:is(.micl-button-text-l,.micl-button-elevated-l,.micl-button-filled-l,.micl-button-tonal-l,.micl-button-outlined-l){font:var(--md-sys-typescale-headline-small-weight) var(--md-sys-typescale-headline-small-size)/var(--md-sys-typescale-headline-small-line-height) var(--md-sys-typescale-headline-small-font);letter-spacing:var(--md-sys-typescale-headline-small-tracking);--micl-width: 96px;--micl-height: 96px;--_shape-toggle: var(--md-sys-shape-corner-extra-large);--_shape-pressed: var(--md-sys-shape-corner-large);column-gap:12px;padding-inline:48px}:is(.micl-button-text-l,.micl-button-elevated-l,.micl-button-filled-l,.micl-button-tonal-l,.micl-button-outlined-l) .micl-button__icon{font-size:32px;inline-size:32px}:is(.micl-button-text-xl,.micl-button-elevated-xl,.micl-button-filled-xl,.micl-button-tonal-xl,.micl-button-outlined-xl){font:var(--md-sys-typescale-headline-large-weight) var(--md-sys-typescale-headline-large-size)/var(--md-sys-typescale-headline-large-line-height) var(--md-sys-typescale-headline-large-font);letter-spacing:var(--md-sys-typescale-headline-large-tracking);--micl-width: 136px;--micl-height: 136px;--_shape-toggle: var(--md-sys-shape-corner-extra-large);--_shape-pressed: var(--md-sys-shape-corner-large);column-gap:16px;padding-inline:64px}:is(.micl-button-text-xl,.micl-button-elevated-xl,.micl-button-filled-xl,.micl-button-tonal-xl,.micl-button-outlined-xl) .micl-button__icon{font-size:40px;inline-size:40px}[class*=micl-button-text-]{--statelayer-color: var(--md-sys-color-primary);background-color:rgba(0,0,0,0);color:var(--md-comp-text-button-label-text-color, var(--md-sys-color-primary));text-decoration:none}[class*=micl-button-text-]:is(:disabled,:has(input:disabled,>button:disabled)){background-color:rgba(0,0,0,0);color:var(--md-comp-text-button-disabled-label-text-color, rgb(from var(--md-sys-color-on-surface-variant) r g b/var(--md-comp-text-button-disabled-label-text-opacity, 38%)))}[class*=micl-button-filled-]{--statelayer-color: var(--md-sys-color-on-primary);background-color:var(--md-comp-filled-button-container-color, var(--md-sys-color-primary));color:var(--md-comp-filled-button-label-text-color, var(--md-sys-color-on-primary))}[class*=micl-button-filled-]:is(:disabled,:has(input:disabled,>button:disabled)){background-color:var(--md-comp-filled-button-disabled-container-color, rgb(from var(--md-sys-color-on-surface) r g b/var(--md-comp-filled-button-disabled-container-opacity, 10%)));color:var(--md-comp-filled-button-disabled-label-text-color, rgb(from var(--md-sys-color-on-surface-variant) r g b/var(--md-comp-filled-button-disabled-label-text-opacity, 38%)))}[class*=micl-button-filled-]:not(:disabled,:has(input:disabled,>button:disabled)):hover:not(:active){box-shadow:var(--md-sys-elevation-level1)}[class*=micl-button-filled-]:not(:disabled,:has(input:disabled,>button:disabled)).micl-button--toggle[aria-pressed=true] .micl-button__icon{font-variation-settings:"FILL" 1}[class*=micl-button-filled-]:not(:disabled,:has(input:disabled,>button:disabled)).micl-button--toggle:not([aria-pressed=true]){--statelayer-color: var(--md-sys-color-on-surface-variant);background-color:var(--md-comp-filled-button-unselected-container-color, var(--md-sys-color-surface-container));color:var(--md-comp-filled-button-unselected-label-text-color, var(--md-sys-color-on-surface-variant))}[class*=micl-button-tonal-]{--statelayer-color: var(--md-sys-color-on-secondary-container);background-color:var(--md-comp-filled-tonal-button-container-color, var(--md-sys-color-secondary-container));color:var(--md-comp-filled-tonal-button-label-text-color, var(--md-sys-color-on-secondary-container))}[class*=micl-button-tonal-]:is(:disabled,:has(input:disabled,>button:disabled)){background-color:var(--md-comp-filled-tonal-button-disabled-container-color, rgb(from var(--md-sys-color-on-surface) r g b/var(--md-comp-filled-tonal-button-disabled-container-opacity, 10%)));color:var(--md-comp-filled-tonal-button-disabled-label-text-color, rgb(from var(--md-sys-color-on-surface-variant) r g b/var(--md-comp-filled-tonal-button-disabled-label-text-opacity, 38%)))}[class*=micl-button-tonal-]:not(:disabled,:has(input:disabled,>button:disabled)):hover:not(:active){box-shadow:var(--md-sys-elevation-level1)}[class*=micl-button-tonal-]:not(:disabled,:has(input:disabled,>button:disabled)).micl-button--toggle[aria-pressed=true]{--statelayer-color: var(--md-sys-color-on-secondary);background-color:var(--md-comp-filled-tonal-button-selected-container-color, var(--md-sys-color-secondary));color:var(--md-comp-filled-tonal-button-selected-label-text-color, var(--md-sys-color-on-secondary))}[class*=micl-button-tonal-]:not(:disabled,:has(input:disabled,>button:disabled)).micl-button--toggle[aria-pressed=true] .micl-button__icon{font-variation-settings:"FILL" 1}.micl-button-outlined-l{border-width:2px}.micl-button-outlined-xl{border-width:3px}
package/dist/card.css CHANGED
@@ -1 +1 @@
1
- :root{--md-ref-typeface-plain: Google Sans, system-ui, sans-serif;--md-ref-typeface-plain-narrow: 0;--md-ref-typeface-brand: Google Sans, system-ui, sans-serif;--md-ref-typeface-weight-regular: 400;--md-ref-typeface-weight-medium: 500;--md-ref-typeface-weight-bold: 700}body{--md-sys-elevation-level0: none}body{--md-sys-elevation-level1: rgb(from var(--md-sys-color-shadow) r g b/0.3) 0 1px 2px 0, rgb(from var(--md-sys-color-shadow) r g b/0.15) 0 1px 3px 1px}body{--md-sys-elevation-level2: rgb(from var(--md-sys-color-shadow) r g b/0.3) 0 1px 2px 0, rgb(from var(--md-sys-color-shadow) r g b/0.15) 0 2px 6px 2px}body{--md-sys-elevation-level3: rgb(from var(--md-sys-color-shadow) r g b/0.3) 0 1px 3px 0, rgb(from var(--md-sys-color-shadow) r g b/0.15) 0 4px 8px 3px}body{--md-sys-elevation-level4: rgb(from var(--md-sys-color-shadow) r g b/0.3) 0 2px 3px 0, rgb(from var(--md-sys-color-shadow) r g b/0.15) 0 6px 10px 4px}:root{--md-sys-shape-corner-medium: 12px}:root{--md-sys-state-hover-state-layer-opacity: 8%}:root{--md-sys-state-focus-state-layer-opacity: 10%}:root{--md-sys-state-pressed-state-layer-opacity: 10%}:root{--md-sys-state-dragged-state-layer-opacity: 16%}:root{--md-sys-state-disabled-state-layer-opacity: 38%}:root{--md-sys-state-focus-indicator-thickness: 3px}:root{--md-sys-state-focus-indicator-outer-offset: 2px}:root{--md-sys-state-ripple-opacity-factor: 0.6}:root{--md-sys-state-ripple-duration: 750ms}@property --statelayer-color{syntax:"<color>";initial-value:rgba(0,0,0,0);inherits:false}@property --statelayer-opacity{syntax:"<percentage>";initial-value:0%;inherits:false}@keyframes micl-ripple{from{background-size:0% 0%,100%;animation-timing-function:cubic-bezier(0.2, 0, 0, 1)}60%{background-size:1000% 1000%,100%;animation-timing-function:cubic-bezier(0.3, 0, 1, 1)}to{background-size:10000% 10000%,100%}}:root{--md-sys-typescale-title-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-title-medium-size: 1rem;--md-sys-typescale-title-medium-line-height: 1.5rem;--md-sys-typescale-title-medium-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-title-medium-tracking: 0.0125rem}:root{--md-sys-typescale-body-smallmedium-font: var(--md-ref-typeface-plain);--md-sys-typescale-body-smallmedium-size: 0.8125rem;--md-sys-typescale-body-smallmedium-line-height: 1.125rem;--md-sys-typescale-body-smallmedium-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-body-smallmedium-tracking: 0.025rem}:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined){--md-comp-card-motion-spatial: cubic-bezier(0.38, 1.21, 0.22, 1);--md-comp-card-motion-duration: 500ms;--_card-color: var(--md-sys-color-on-surface-variant);display:flex;flex-direction:column;block-size:fit-content;margin:0;outline:none;overflow:hidden;interpolate-size:allow-keywords;border-radius:var(--_card-shape);background-color:var(--_card-background-color);box-shadow:var(--_card-elevation);border:var(--_card-border, none);opacity:var(--_card-opacity, 1);pointer-events:var(--_card-pointer-events, auto)}:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined):not(.micl-card--compact):not(:has(>summary)){row-gap:var(--md-comp-card-gap, 8px)}:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined)[tabindex="0"]:not([inert]),:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined):not([inert])>summary{--micl-ripple: 1;background-image:radial-gradient(circle at var(--micl-x, center) var(--micl-y, center), transparent 0%, rgb(from var(--statelayer-color) r g b/calc(var(--statelayer-opacity) * var(--md-sys-state-ripple-opacity-factor))) 10%, transparent 10%),linear-gradient(rgb(from var(--statelayer-color) r g b/var(--statelayer-opacity)));background-repeat:no-repeat;background-position:var(--micl-x, center) var(--micl-y, center),0 0;background-size:0%,100%;transition:background-size 0ms,--statelayer-opacity var(--md-comp-card-motion-duration) linear}:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined)[tabindex="0"]:not([inert]):is(:hover,:focus-visible,:active,.micl-card--dragging),:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined):not([inert])>summary:is(:hover,:focus-visible,:active,.micl-card--dragging){--_card-color: var(--md-sys-color-on-surface)}:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined)[tabindex="0"]:not([inert]):hover,:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined):not([inert])>summary:hover{--statelayer-color: var(--_card-hover-state-color);--statelayer-opacity: var(--_card-hover-state-opacity);cursor:pointer}:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined)[tabindex="0"]:not([inert]):focus-visible,:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined):not([inert])>summary:focus-visible{--statelayer-color: var(--_card-focus-state-color);--statelayer-opacity: var(--_card-focus-state-opacity)}:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined)[tabindex="0"]:not([inert]):active,:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined):not([inert])>summary:active{--statelayer-color: var(--_card-pressed-state-color);--statelayer-opacity: var(--_card-pressed-state-opacity)}:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined)[tabindex="0"]:not([inert]).micl-card--dragging,:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined):not([inert])>summary.micl-card--dragging{--statelayer-color: var(--_card-dragged-state-color);--statelayer-opacity: var(--_card-dragged-state-opacity);cursor:grabbing}:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined)[tabindex="0"]:not([inert]).micl-rippling,:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined):not([inert])>summary.micl-rippling{animation:micl-ripple calc(var(--md-sys-state-ripple-duration)*1.722)}:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined)[tabindex="0"]:not([inert]) .micl-card__content,:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined):not([inert])>summary .micl-card__content{background-color:rgba(0,0,0,0)}:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined)[tabindex="0"]:not([inert]):hover,:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined):not([tabindex="0"]):not([inert]):has(>summary:hover){box-shadow:var(--_card-hover-elevation);border-color:var(--_card-hover-border-color, var(--_card-border-color, transparent))}:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined)[tabindex="0"]:not([inert]):focus-visible,:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined):not([tabindex="0"]):not([inert]):has(>summary:focus-visible){box-shadow:var(--_card-focus-elevation);border-color:var(--_card-focus-border-color, transparent);outline:var(--_card-focus-outline-thickness, 0px) solid var(--_card-focus-outline-color, transparent);outline-offset:var(--_card-focus-outline-offset, 0px)}:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined)[tabindex="0"]:not([inert]):active,:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined):not([tabindex="0"]):not([inert]):has(>summary:active){box-shadow:var(--_card-pressed-elevation);border-color:var(--_card-pressed-border-color, transparent)}:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined)[tabindex="0"]:not([inert]).micl-card--dragging{box-shadow:var(--_card-dragged-elevation);border-color:var(--_card-dragged-border-color, transparent)}:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined)::details-content{block-size:0;overflow:hidden;transition:block-size var(--md-comp-card-motion-duration) var(--md-comp-card-motion-spatial),content-visibility var(--md-comp-card-motion-duration) linear allow-discrete}:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined)[open]::details-content{block-size:auto}:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined)>summary{display:flex;flex-direction:column;padding-block-end:var(--md-comp-card-content-padding-block, 16px);outline:none;list-style:none;cursor:pointer;-webkit-tap-highlight-color:rgba(0,0,0,0)}:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined)>summary:not(.micl-card--compact){row-gap:var(--md-comp-card-gap, 8px)}.micl-card-elevated{--_card-shape: var(--md-comp-elevated-card-container-shape, var(--md-sys-shape-corner-medium));--_card-background-color: var(--md-comp-elevated-card-container-color, var(--md-sys-color-surface-container-low));--_card-elevation: var(--md-comp-elevated-card-container-elevation, var(--md-sys-elevation-level1));--_card-hover-state-color: var(--md-comp-elevated-card-hover-state-layer-color, var(--md-sys-color-on-surface));--_card-hover-state-opacity: var(--md-comp-elevated-card-hover-state-layer-opacity, var(--md-sys-state-hover-state-layer-opacity));--_card-hover-elevation: var(--md-comp-elevated-card-hover-container-elevation, var(--md-sys-elevation-level2));--_card-focus-state-color: var(--md-comp-elevated-card-focus-state-layer-color, var(--md-sys-color-on-surface));--_card-focus-state-opacity: var(--md-comp-elevated-card-focus-state-layer-opacity, var(--md-sys-state-focus-state-layer-opacity));--_card-focus-elevation: var(--md-comp-elevated-card-focus-container-elevation, var(--md-sys-elevation-level1));--_card-pressed-state-color: var(--md-comp-elevated-card-pressed-state-layer-color, var(--md-sys-color-on-surface));--_card-pressed-state-opacity: var(--md-comp-elevated-card-pressed-state-layer-opacity, var(--md-sys-state-pressed-state-layer-opacity));--_card-pressed-elevation: var(--md-comp-elevated-card-pressed-container-elevation, var(--md-sys-elevation-level1));--_card-dragged-state-color: var(--md-comp-elevated-card-dragged-state-layer-color, var(--md-sys-color-on-surface));--_card-dragged-state-opacity: var(--md-comp-elevated-card-dragged-state-layer-opacity, var(--md-sys-state-dragged-state-layer-opacity));--_card-dragged-elevation: var(--md-comp-elevated-card-dragged-container-elevation, var(--md-sys-elevation-level4))}.micl-card-elevated[inert]{--_card-background-color: var(--md-comp-elevated-card-disabled-container-color, var(--md-sys-color-surface));--_card-elevation: var(--md-comp-elevated-card-disabled-container-elevation, var(--md-sys-elevation-level1));--_card-opacity: var(--md-comp-elevated-card-disabled-container-opacity, var(--md-sys-state-disabled-state-layer-opacity));--_card-pointer-events: none}.micl-card-elevated{--_card-focus-outline-thickness: var(--md-comp-elevated-card-focus-indicator-thickness, var(--md-sys-state-focus-indicator-thickness));--_card-focus-outline-color: var(--md-comp-elevated-card-focus-indicator-color, var(--md-sys-color-secondary));--_card-focus-outline-offset: var(--md-comp-elevated-card-focus-indicator-outline-offset, var(--md-sys-state-focus-indicator-outer-offset))}.micl-card-filled{--_card-shape: var(--md-comp-filled-card-container-shape, var(--md-sys-shape-corner-medium));--_card-background-color: var(--md-comp-filled-card-container-color, var(--md-sys-color-surface-container-highest));--_card-elevation: var(--md-comp-filled-card-container-elevation, var(--md-sys-elevation-level0));--_card-hover-state-color: var(--md-comp-filled-card-hover-state-layer-color, var(--md-sys-color-on-surface));--_card-hover-state-opacity: var(--md-comp-filled-card-hover-state-layer-opacity, var(--md-sys-state-hover-state-layer-opacity));--_card-hover-elevation: var(--md-comp-filled-card-hover-container-elevation, var(--md-sys-elevation-level1));--_card-focus-state-color: var(--md-comp-filled-card-focus-state-layer-color, var(--md-sys-color-on-surface));--_card-focus-state-opacity: var(--md-comp-filled-card-focus-state-layer-opacity, var(--md-sys-state-focus-state-layer-opacity));--_card-focus-elevation: var(--md-comp-filled-card-focus-container-elevation, var(--md-sys-elevation-level0));--_card-pressed-state-color: var(--md-comp-filled-card-pressed-state-layer-color, var(--md-sys-color-on-surface));--_card-pressed-state-opacity: var(--md-comp-filled-card-pressed-state-layer-opacity, var(--md-sys-state-pressed-state-layer-opacity));--_card-pressed-elevation: var(--md-comp-filled-card-pressed-container-elevation, var(--md-sys-elevation-level0));--_card-dragged-state-color: var(--md-comp-filled-card-dragged-state-layer-color, var(--md-sys-color-on-surface));--_card-dragged-state-opacity: var(--md-comp-filled-card-dragged-state-layer-opacity, var(--md-sys-state-dragged-state-layer-opacity));--_card-dragged-elevation: var(--md-comp-filled-card-dragged-container-elevation, var(--md-sys-elevation-level3))}.micl-card-filled[inert]{--_card-background-color: var(--md-comp-filled-card-disabled-container-color, var(--md-sys-color-surface-variant));--_card-elevation: var(--md-comp-filled-card-disabled-container-elevation, var(--md-sys-elevation-level0));--_card-opacity: var(--md-comp-filled-card-disabled-container-opacity, var(--md-sys-state-disabled-state-layer-opacity));--_card-pointer-events: none}.micl-card-filled{--_card-focus-outline-thickness: var(--md-comp-filled-card-focus-indicator-thickness, var(--md-sys-state-focus-indicator-thickness));--_card-focus-outline-color: var(--md-comp-filled-card-focus-indicator-color, var(--md-sys-color-secondary));--_card-focus-outline-offset: var(--md-comp-filled-card-focus-indicator-outline-offset, var(--md-sys-state-focus-indicator-outer-offset))}.micl-card-outlined{--_card-shape: var(--md-comp-outlined-card-container-shape, var(--md-sys-shape-corner-medium));--_card-background-color: var(--md-comp-outlined-card-container-color, var(--md-sys-color-surface));--_card-elevation: var(--md-comp-outlined-card-container-elevation, var(--md-sys-elevation-level0));--_card-hover-state-color: var(--md-comp-outlined-card-hover-state-layer-color, var(--md-sys-color-on-surface));--_card-hover-state-opacity: var(--md-comp-outlined-card-hover-state-layer-opacity, var(--md-sys-state-hover-state-layer-opacity));--_card-hover-elevation: var(--md-comp-outlined-card-hover-container-elevation, var(--md-sys-elevation-level1));--_card-focus-state-color: var(--md-comp-outlined-card-focus-state-layer-color, var(--md-sys-color-on-surface));--_card-focus-state-opacity: var(--md-comp-outlined-card-focus-state-layer-opacity, var(--md-sys-state-focus-state-layer-opacity));--_card-focus-elevation: var(--md-comp-outlined-card-focus-container-elevation, var(--md-sys-elevation-level0));--_card-pressed-state-color: var(--md-comp-outlined-card-pressed-state-layer-color, var(--md-sys-color-on-surface));--_card-pressed-state-opacity: var(--md-comp-outlined-card-pressed-state-layer-opacity, var(--md-sys-state-pressed-state-layer-opacity));--_card-pressed-elevation: var(--md-comp-outlined-card-pressed-container-elevation, var(--md-sys-elevation-level0));--_card-dragged-state-color: var(--md-comp-outlined-card-dragged-state-layer-color, var(--md-sys-color-on-surface));--_card-dragged-state-opacity: var(--md-comp-outlined-card-dragged-state-layer-opacity, var(--md-sys-state-dragged-state-layer-opacity));--_card-dragged-elevation: var(--md-comp-outlined-card-dragged-container-elevation, var(--md-sys-elevation-level3))}.micl-card-outlined[inert]{--_card-background-color: var(--md-comp-outlined-card-disabled-container-color, var(--md-sys-color-surface));--_card-elevation: var(--md-comp-outlined-card-disabled-container-elevation, var(--md-sys-elevation-level0));--_card-opacity: var(--md-comp-outlined-card-disabled-container-opacity, var(--md-sys-state-disabled-state-layer-opacity));--_card-pointer-events: none}.micl-card-outlined{--_card-focus-outline-thickness: var(--md-comp-outlined-card-focus-indicator-thickness, var(--md-sys-state-focus-indicator-thickness));--_card-focus-outline-color: var(--md-comp-outlined-card-focus-indicator-color, var(--md-sys-color-secondary));--_card-focus-outline-offset: var(--md-comp-outlined-card-focus-indicator-outline-offset, var(--md-sys-state-focus-indicator-outer-offset));--_card-border-width: var(--md-comp-outlined-card-outline-width, 1px);--_card-border: var(--_card-border-width) solid var(--_card-border-color, var(--md-comp-outlined-card-outline-color, var(--md-sys-color-outline-variant)));--_card-hover-border-color: var(--md-comp-outlined-card-hover-outline-color, var(--md-sys-color-outline-variant));--_card-focus-border-color: var(--md-comp-outlined-card-focus-outline-color, var(--md-sys-color-on-surface));--_card-pressed-border-color: var(--md-comp-outlined-card-pressed-outline-color, var(--md-sys-color-outline-variant));--_card-dragged-border-color: var(--md-comp-outlined-card-dragged-outline-color, var(--md-sys-color-outline-variant))}.micl-card-outlined[inert]{--_card-border-color: rgb(from var(--md-comp-outlined-card-disabled-outline-color, var(--md-sys-color-outline)) r g b / var(--md-comp-outlined-card-disabled-outline-opacity, 12%))}.micl-card__image{display:block;inline-size:100%;background-position:center;background-repeat:no-repeat;background-size:contain;border-radius:var(--_card-shape)}:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined)>[class*=micl-card__headline-]:first-child,:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined)>summary>[class*=micl-card__headline-]:first-child{padding-block-start:var(--md-comp-card-content-padding-block, 16px)}[class*=micl-card__headline-]{display:flex;align-items:center;column-gap:var(--md-comp-card-gap, 8px);color:var(--_card-color)}[class*=micl-card__headline-] :is(h1,h2,h3,h4,h5,h6,.micl-heading){flex:1 2 fit-content;margin:0;padding-inline:var(--md-comp-card-padding-inline, 16px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}[class*=micl-card__headline-] :is(h1,h2,h3,h4,h5,h6,.micl-heading):has(+button){padding-inline-end:0}[class*=micl-card__headline-]:has(button){margin-block:0}.micl-card__headline-s :is(h1,h2,h3,h4,h5,h6,.micl-heading){font-family:var(--md-sys-typescale-headline-small-font);font-size:var(--md-sys-typescale-headline-small-size);line-height:var(--md-sys-typescale-headline-small-line-height);font-weight:var(--md-sys-typescale-headline-small-weight);letter-spacing:var(--md-sys-typescale-headline-small-tracking)}.micl-card__headline-m :is(h1,h2,h3,h4,h5,h6,.micl-heading){font-family:var(--md-sys-typescale-headline-medium-font);font-size:var(--md-sys-typescale-headline-medium-size);line-height:var(--md-sys-typescale-headline-medium-line-height);font-weight:var(--md-sys-typescale-headline-medium-weight);letter-spacing:var(--md-sys-typescale-headline-medium-tracking)}.micl-card__headline-l :is(h1,h2,h3,h4,h5,h6,.micl-heading){font-family:var(--md-sys-typescale-headline-large-font);font-size:var(--md-sys-typescale-headline-large-size);line-height:var(--md-sys-typescale-headline-large-line-height);font-weight:var(--md-sys-typescale-headline-large-weight);letter-spacing:var(--md-sys-typescale-headline-large-tracking)}.micl-card__subhead{font-family:var(--md-sys-typescale-title-medium-font);font-size:var(--md-sys-typescale-title-medium-size);line-height:var(--md-sys-typescale-title-medium-line-height);font-weight:var(--md-sys-typescale-title-medium-weight);letter-spacing:var(--md-sys-typescale-title-medium-tracking);display:block;margin:calc(-1*var(--md-comp-card-gap, 8px)) 0 var(--md-comp-card-gap, 8px) 0;padding:0 var(--md-comp-card-padding-inline, 16px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--_card-color)}.micl-card__supporting-text{font-family:var(--md-sys-typescale-body-smallmedium-font);font-size:var(--md-sys-typescale-body-smallmedium-size);line-height:var(--md-sys-typescale-body-smallmedium-line-height);font-weight:var(--md-sys-typescale-body-smallmedium-weight);letter-spacing:var(--md-sys-typescale-body-smallmedium-tracking);display:block;margin:0;padding:0 var(--md-comp-card-padding-inline, 16px);color:var(--_card-color)}.micl-card__content{box-sizing:border-box;padding-block:var(--md-comp-card-content-padding-block, 16px);padding-inline:var(--md-comp-card-padding-inline, 16px);overflow:clip visible}.micl-card__actions{box-sizing:border-box;display:flex;flex-shrink:0;flex-wrap:wrap;gap:8px;padding-block:0 var(--md-comp-card-content-padding-block, 16px);padding-inline:var(--md-comp-card-padding-inline, 16px)}.micl-card__actions.micl-card__actions--outset-start{padding-inline-start:calc(var(--md-comp-card-padding-inline, 16px) - 16px)}.micl-card__actions.micl-card__actions--outset-end{padding-inline-end:calc(var(--md-comp-card-padding-inline, 16px) - 16px)}.micl-card--compact,summary.micl-card--compact{display:grid;grid-template-columns:20% 1fr;padding-block-end:0}.micl-card--compact .micl-card__image,summary.micl-card--compact .micl-card__image{grid-column:1;grid-row:1/span 4;block-size:100%;background-size:cover}.micl-card--compact [class*=micl-card__headline-],.micl-card--compact .micl-card__subhead,.micl-card--compact .micl-card__supporting-text,summary.micl-card--compact [class*=micl-card__headline-],summary.micl-card--compact .micl-card__subhead,summary.micl-card--compact .micl-card__supporting-text{grid-column:2;min-inline-size:0}.micl-card--compact [class*=micl-card__headline-],.micl-card--compact .micl-card__supporting-text,summary.micl-card--compact [class*=micl-card__headline-],summary.micl-card--compact .micl-card__supporting-text{margin-block-start:var(--md-comp-card-gap, 8px)}.micl-card--compact .micl-card__subhead,summary.micl-card--compact .micl-card__subhead{margin-block-start:0}.micl-card--compact .micl-card__content,summary.micl-card--compact .micl-card__content{grid-column:1/span 2}.micl-card--compact:not(:has(.micl-card__content))>:last-child,summary.micl-card--compact:not(:has(.micl-card__content))>:last-child{margin-block-end:var(--md-comp-card-gap, 8px)}
1
+ :root{--md-ref-typeface-plain: Google Sans, system-ui, sans-serif;--md-ref-typeface-plain-narrow: 0;--md-ref-typeface-brand: Google Sans, system-ui, sans-serif;--md-ref-typeface-weight-regular: 400;--md-ref-typeface-weight-medium: 500;--md-ref-typeface-weight-bold: 700}body{--md-sys-elevation-level0: none}body{--md-sys-elevation-level1: rgb(from var(--md-sys-color-shadow) r g b/0.3) 0 1px 2px 0, rgb(from var(--md-sys-color-shadow) r g b/0.15) 0 1px 3px 1px}body{--md-sys-elevation-level2: rgb(from var(--md-sys-color-shadow) r g b/0.3) 0 1px 2px 0, rgb(from var(--md-sys-color-shadow) r g b/0.15) 0 2px 6px 2px}body{--md-sys-elevation-level3: rgb(from var(--md-sys-color-shadow) r g b/0.3) 0 1px 3px 0, rgb(from var(--md-sys-color-shadow) r g b/0.15) 0 4px 8px 3px}body{--md-sys-elevation-level4: rgb(from var(--md-sys-color-shadow) r g b/0.3) 0 2px 3px 0, rgb(from var(--md-sys-color-shadow) r g b/0.15) 0 6px 10px 4px}:root{--md-sys-shape-corner-medium: 12px}:root{--md-sys-state-hover-state-layer-opacity: 8%}:root{--md-sys-state-focus-state-layer-opacity: 10%}:root{--md-sys-state-pressed-state-layer-opacity: 10%}:root{--md-sys-state-dragged-state-layer-opacity: 16%}:root{--md-sys-state-disabled-state-layer-opacity: 38%}:root{--md-sys-state-focus-indicator-thickness: 3px}:root{--md-sys-state-focus-indicator-outer-offset: 2px}:root{--md-sys-state-ripple-opacity-factor: 0.6}:root{--md-sys-state-ripple-duration: 750ms}@property --statelayer-color{syntax:"<color>";initial-value:rgba(0,0,0,0);inherits:false}@property --statelayer-opacity{syntax:"<percentage>";initial-value:0%;inherits:false}@keyframes micl-ripple{from{background-size:0% 0%,100%;animation-timing-function:cubic-bezier(0.2, 0, 0, 1)}60%{background-size:1000% 1000%,100%;animation-timing-function:cubic-bezier(0.3, 0, 1, 1)}to{background-size:10000% 10000%,100%}}:root{--md-sys-typescale-title-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-title-medium-size: 1rem;--md-sys-typescale-title-medium-line-height: 1.5rem;--md-sys-typescale-title-medium-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-title-medium-tracking: 0.0125rem}:root{--md-sys-typescale-body-smallmedium-font: var(--md-ref-typeface-plain);--md-sys-typescale-body-smallmedium-size: 0.8125rem;--md-sys-typescale-body-smallmedium-line-height: 1.125rem;--md-sys-typescale-body-smallmedium-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-body-smallmedium-tracking: 0.025rem}:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined){--md-comp-card-motion-spatial: cubic-bezier(0.38, 1.21, 0.22, 1);--md-comp-card-motion-duration: 500ms;--_card-color: var(--md-sys-color-on-surface-variant);display:flex;flex-direction:column;block-size:fit-content;margin:0;outline:none;overflow:hidden;interpolate-size:allow-keywords;border-radius:var(--_card-shape);background-color:var(--_card-background-color);box-shadow:var(--_card-elevation);border:var(--_card-border, none);opacity:var(--_card-opacity, 1);pointer-events:var(--_card-pointer-events, auto)}:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined):not(.micl-card--compact):not(:has(>summary)){row-gap:var(--md-comp-card-gap, 8px)}:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined)[tabindex="0"]:not([inert]),:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined):not([inert])>summary{--micl-ripple: 1;background-image:radial-gradient(circle at var(--micl-x, center) var(--micl-y, center), transparent 0%, rgb(from var(--statelayer-color) r g b/calc(var(--statelayer-opacity) * var(--md-sys-state-ripple-opacity-factor))) 10%, transparent 10%),linear-gradient(rgb(from var(--statelayer-color) r g b/var(--statelayer-opacity)));background-repeat:no-repeat;background-position:var(--micl-x, center) var(--micl-y, center),0 0;background-size:0%,100%;transition:background-size 0ms,--statelayer-opacity var(--md-comp-card-motion-duration) linear}:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined)[tabindex="0"]:not([inert]):is(:hover,:focus-visible,:active,.micl-card--dragging),:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined):not([inert])>summary:is(:hover,:focus-visible,:active,.micl-card--dragging){--_card-color: var(--md-sys-color-on-surface)}:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined)[tabindex="0"]:not([inert]):hover,:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined):not([inert])>summary:hover{--statelayer-color: var(--_card-hover-state-color);--statelayer-opacity: var(--_card-hover-state-opacity);cursor:pointer}:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined)[tabindex="0"]:not([inert]):focus-visible,:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined):not([inert])>summary:focus-visible{--statelayer-color: var(--_card-focus-state-color);--statelayer-opacity: var(--_card-focus-state-opacity)}:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined)[tabindex="0"]:not([inert]):active,:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined):not([inert])>summary:active{--statelayer-color: var(--_card-pressed-state-color);--statelayer-opacity: var(--_card-pressed-state-opacity)}:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined)[tabindex="0"]:not([inert]).micl-card--dragging,:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined):not([inert])>summary.micl-card--dragging{--statelayer-color: var(--_card-dragged-state-color);--statelayer-opacity: var(--_card-dragged-state-opacity);cursor:grabbing}:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined)[tabindex="0"]:not([inert]).micl-rippling,:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined):not([inert])>summary.micl-rippling{animation:micl-ripple calc(var(--md-sys-state-ripple-duration)*1.722)}:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined)[tabindex="0"]:not([inert]) .micl-card__content,:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined):not([inert])>summary .micl-card__content{background-color:rgba(0,0,0,0)}:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined)[tabindex="0"]:not([inert]):hover,:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined):not([tabindex="0"]):not([inert]):has(>summary:hover){box-shadow:var(--_card-hover-elevation);border-color:var(--_card-hover-border-color, var(--_card-border-color, transparent))}:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined)[tabindex="0"]:not([inert]):focus-visible,:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined):not([tabindex="0"]):not([inert]):has(>summary:focus-visible){box-shadow:var(--_card-focus-elevation);border-color:var(--_card-focus-border-color, transparent);outline:var(--_card-focus-outline-thickness, 0px) solid var(--_card-focus-outline-color, transparent);outline-offset:var(--_card-focus-outline-offset, 0px)}:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined)[tabindex="0"]:not([inert]):active,:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined):not([tabindex="0"]):not([inert]):has(>summary:active){box-shadow:var(--_card-pressed-elevation);border-color:var(--_card-pressed-border-color, transparent)}:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined)[tabindex="0"]:not([inert]).micl-card--dragging{box-shadow:var(--_card-dragged-elevation);border-color:var(--_card-dragged-border-color, transparent)}:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined)::details-content{block-size:0;overflow:hidden;transition:block-size var(--md-comp-card-motion-duration) var(--md-comp-card-motion-spatial),content-visibility var(--md-comp-card-motion-duration) linear allow-discrete}:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined)[open]::details-content{block-size:auto}:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined)>summary{display:flex;flex-direction:column;padding-block-end:var(--md-comp-card-content-padding-block, 16px);outline:none;list-style:none;cursor:pointer;-webkit-tap-highlight-color:rgba(0,0,0,0)}:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined)>summary:not(.micl-card--compact){row-gap:var(--md-comp-card-gap, 8px)}.micl-card-elevated{--_card-shape: var(--md-comp-elevated-card-container-shape, var(--md-sys-shape-corner-medium));--_card-background-color: var(--md-comp-elevated-card-container-color, var(--md-sys-color-surface-container-low));--_card-elevation: var(--md-comp-elevated-card-container-elevation, var(--md-sys-elevation-level1));--_card-hover-state-color: var(--md-comp-elevated-card-hover-state-layer-color, var(--md-sys-color-on-surface));--_card-hover-state-opacity: var(--md-comp-elevated-card-hover-state-layer-opacity, var(--md-sys-state-hover-state-layer-opacity));--_card-hover-elevation: var(--md-comp-elevated-card-hover-container-elevation, var(--md-sys-elevation-level2));--_card-focus-state-color: var(--md-comp-elevated-card-focus-state-layer-color, var(--md-sys-color-on-surface));--_card-focus-state-opacity: var(--md-comp-elevated-card-focus-state-layer-opacity, var(--md-sys-state-focus-state-layer-opacity));--_card-focus-elevation: var(--md-comp-elevated-card-focus-container-elevation, var(--md-sys-elevation-level1));--_card-pressed-state-color: var(--md-comp-elevated-card-pressed-state-layer-color, var(--md-sys-color-on-surface));--_card-pressed-state-opacity: var(--md-comp-elevated-card-pressed-state-layer-opacity, var(--md-sys-state-pressed-state-layer-opacity));--_card-pressed-elevation: var(--md-comp-elevated-card-pressed-container-elevation, var(--md-sys-elevation-level1));--_card-dragged-state-color: var(--md-comp-elevated-card-dragged-state-layer-color, var(--md-sys-color-on-surface));--_card-dragged-state-opacity: var(--md-comp-elevated-card-dragged-state-layer-opacity, var(--md-sys-state-dragged-state-layer-opacity));--_card-dragged-elevation: var(--md-comp-elevated-card-dragged-container-elevation, var(--md-sys-elevation-level4))}.micl-card-elevated[inert]{--_card-background-color: var(--md-comp-elevated-card-disabled-container-color, var(--md-sys-color-surface));--_card-elevation: var(--md-comp-elevated-card-disabled-container-elevation, var(--md-sys-elevation-level1));--_card-opacity: var(--md-comp-elevated-card-disabled-container-opacity, var(--md-sys-state-disabled-state-layer-opacity));--_card-pointer-events: none}.micl-card-elevated{--_card-focus-outline-thickness: var(--md-comp-elevated-card-focus-indicator-thickness, var(--md-sys-state-focus-indicator-thickness));--_card-focus-outline-color: var(--md-comp-elevated-card-focus-indicator-color, var(--md-sys-color-secondary));--_card-focus-outline-offset: var(--md-comp-elevated-card-focus-indicator-outline-offset, var(--md-sys-state-focus-indicator-outer-offset))}.micl-card-filled{--_card-shape: var(--md-comp-filled-card-container-shape, var(--md-sys-shape-corner-medium));--_card-background-color: var(--md-comp-filled-card-container-color, var(--md-sys-color-surface-container-highest));--_card-elevation: var(--md-comp-filled-card-container-elevation, var(--md-sys-elevation-level0));--_card-hover-state-color: var(--md-comp-filled-card-hover-state-layer-color, var(--md-sys-color-on-surface));--_card-hover-state-opacity: var(--md-comp-filled-card-hover-state-layer-opacity, var(--md-sys-state-hover-state-layer-opacity));--_card-hover-elevation: var(--md-comp-filled-card-hover-container-elevation, var(--md-sys-elevation-level1));--_card-focus-state-color: var(--md-comp-filled-card-focus-state-layer-color, var(--md-sys-color-on-surface));--_card-focus-state-opacity: var(--md-comp-filled-card-focus-state-layer-opacity, var(--md-sys-state-focus-state-layer-opacity));--_card-focus-elevation: var(--md-comp-filled-card-focus-container-elevation, var(--md-sys-elevation-level0));--_card-pressed-state-color: var(--md-comp-filled-card-pressed-state-layer-color, var(--md-sys-color-on-surface));--_card-pressed-state-opacity: var(--md-comp-filled-card-pressed-state-layer-opacity, var(--md-sys-state-pressed-state-layer-opacity));--_card-pressed-elevation: var(--md-comp-filled-card-pressed-container-elevation, var(--md-sys-elevation-level0));--_card-dragged-state-color: var(--md-comp-filled-card-dragged-state-layer-color, var(--md-sys-color-on-surface));--_card-dragged-state-opacity: var(--md-comp-filled-card-dragged-state-layer-opacity, var(--md-sys-state-dragged-state-layer-opacity));--_card-dragged-elevation: var(--md-comp-filled-card-dragged-container-elevation, var(--md-sys-elevation-level3))}.micl-card-filled[inert]{--_card-background-color: var(--md-comp-filled-card-disabled-container-color, var(--md-sys-color-surface-variant));--_card-elevation: var(--md-comp-filled-card-disabled-container-elevation, var(--md-sys-elevation-level0));--_card-opacity: var(--md-comp-filled-card-disabled-container-opacity, var(--md-sys-state-disabled-state-layer-opacity));--_card-pointer-events: none}.micl-card-filled{--_card-focus-outline-thickness: var(--md-comp-filled-card-focus-indicator-thickness, var(--md-sys-state-focus-indicator-thickness));--_card-focus-outline-color: var(--md-comp-filled-card-focus-indicator-color, var(--md-sys-color-secondary));--_card-focus-outline-offset: var(--md-comp-filled-card-focus-indicator-outline-offset, var(--md-sys-state-focus-indicator-outer-offset))}.micl-card-outlined{--_card-shape: var(--md-comp-outlined-card-container-shape, var(--md-sys-shape-corner-medium));--_card-background-color: var(--md-comp-outlined-card-container-color, var(--md-sys-color-surface));--_card-elevation: var(--md-comp-outlined-card-container-elevation, var(--md-sys-elevation-level0));--_card-hover-state-color: var(--md-comp-outlined-card-hover-state-layer-color, var(--md-sys-color-on-surface));--_card-hover-state-opacity: var(--md-comp-outlined-card-hover-state-layer-opacity, var(--md-sys-state-hover-state-layer-opacity));--_card-hover-elevation: var(--md-comp-outlined-card-hover-container-elevation, var(--md-sys-elevation-level1));--_card-focus-state-color: var(--md-comp-outlined-card-focus-state-layer-color, var(--md-sys-color-on-surface));--_card-focus-state-opacity: var(--md-comp-outlined-card-focus-state-layer-opacity, var(--md-sys-state-focus-state-layer-opacity));--_card-focus-elevation: var(--md-comp-outlined-card-focus-container-elevation, var(--md-sys-elevation-level0));--_card-pressed-state-color: var(--md-comp-outlined-card-pressed-state-layer-color, var(--md-sys-color-on-surface));--_card-pressed-state-opacity: var(--md-comp-outlined-card-pressed-state-layer-opacity, var(--md-sys-state-pressed-state-layer-opacity));--_card-pressed-elevation: var(--md-comp-outlined-card-pressed-container-elevation, var(--md-sys-elevation-level0));--_card-dragged-state-color: var(--md-comp-outlined-card-dragged-state-layer-color, var(--md-sys-color-on-surface));--_card-dragged-state-opacity: var(--md-comp-outlined-card-dragged-state-layer-opacity, var(--md-sys-state-dragged-state-layer-opacity));--_card-dragged-elevation: var(--md-comp-outlined-card-dragged-container-elevation, var(--md-sys-elevation-level3))}.micl-card-outlined[inert]{--_card-background-color: var(--md-comp-outlined-card-disabled-container-color, var(--md-sys-color-surface));--_card-elevation: var(--md-comp-outlined-card-disabled-container-elevation, var(--md-sys-elevation-level0));--_card-opacity: var(--md-comp-outlined-card-disabled-container-opacity, var(--md-sys-state-disabled-state-layer-opacity));--_card-pointer-events: none}.micl-card-outlined{--_card-focus-outline-thickness: var(--md-comp-outlined-card-focus-indicator-thickness, var(--md-sys-state-focus-indicator-thickness));--_card-focus-outline-color: var(--md-comp-outlined-card-focus-indicator-color, var(--md-sys-color-secondary));--_card-focus-outline-offset: var(--md-comp-outlined-card-focus-indicator-outline-offset, var(--md-sys-state-focus-indicator-outer-offset));--_card-border-width: var(--md-comp-outlined-card-outline-width, 1px);--_card-border: var(--_card-border-width) solid var(--_card-border-color, var(--md-comp-outlined-card-outline-color, var(--md-sys-color-outline-variant)));--_card-hover-border-color: var(--md-comp-outlined-card-hover-outline-color, var(--md-sys-color-outline-variant));--_card-focus-border-color: var(--md-comp-outlined-card-focus-outline-color, var(--md-sys-color-on-surface));--_card-pressed-border-color: var(--md-comp-outlined-card-pressed-outline-color, var(--md-sys-color-outline-variant));--_card-dragged-border-color: var(--md-comp-outlined-card-dragged-outline-color, var(--md-sys-color-outline-variant))}.micl-card-outlined[inert]{--_card-border-color: rgb(from var(--md-comp-outlined-card-disabled-outline-color, var(--md-sys-color-outline)) r g b / var(--md-comp-outlined-card-disabled-outline-opacity, 12%))}.micl-card__image{display:block;inline-size:100%;background-position:center;background-repeat:no-repeat;background-size:contain;border-radius:var(--_card-shape)}:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined)>[class*=micl-card__headline-]:first-child,:is(.micl-card-elevated,.micl-card-filled,.micl-card-outlined)>summary>[class*=micl-card__headline-]:first-child{padding-block-start:var(--md-comp-card-content-padding-block, 16px)}[class*=micl-card__headline-]{display:flex;align-items:center;column-gap:var(--md-comp-card-gap, 8px);color:var(--_card-color)}[class*=micl-card__headline-] :is(h1,h2,h3,h4,h5,h6,.micl-heading){flex:1 2 fit-content;margin:0;padding-inline:var(--md-comp-card-padding-inline, 16px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}[class*=micl-card__headline-] :is(h1,h2,h3,h4,h5,h6,.micl-heading):has(+button){padding-inline-end:0}[class*=micl-card__headline-]:has(button){margin-block:0}.micl-card__headline-s :is(h1,h2,h3,h4,h5,h6,.micl-heading){font:var(--md-sys-typescale-headline-small-weight) var(--md-sys-typescale-headline-small-size)/var(--md-sys-typescale-headline-small-line-height) var(--md-sys-typescale-headline-small-font);letter-spacing:var(--md-sys-typescale-headline-small-tracking)}.micl-card__headline-m :is(h1,h2,h3,h4,h5,h6,.micl-heading){font:var(--md-sys-typescale-headline-medium-weight) var(--md-sys-typescale-headline-medium-size)/var(--md-sys-typescale-headline-medium-line-height) var(--md-sys-typescale-headline-medium-font);letter-spacing:var(--md-sys-typescale-headline-medium-tracking)}.micl-card__headline-l :is(h1,h2,h3,h4,h5,h6,.micl-heading){font:var(--md-sys-typescale-headline-large-weight) var(--md-sys-typescale-headline-large-size)/var(--md-sys-typescale-headline-large-line-height) var(--md-sys-typescale-headline-large-font);letter-spacing:var(--md-sys-typescale-headline-large-tracking)}.micl-card__subhead{font:var(--md-sys-typescale-title-medium-weight) var(--md-sys-typescale-title-medium-size)/var(--md-sys-typescale-title-medium-line-height) var(--md-sys-typescale-title-medium-font);letter-spacing:var(--md-sys-typescale-title-medium-tracking);display:block;margin:calc(-1*var(--md-comp-card-gap, 8px)) 0 var(--md-comp-card-gap, 8px) 0;padding:0 var(--md-comp-card-padding-inline, 16px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--_card-color)}.micl-card__supporting-text{font:var(--md-sys-typescale-body-smallmedium-weight) var(--md-sys-typescale-body-smallmedium-size)/var(--md-sys-typescale-body-smallmedium-line-height) var(--md-sys-typescale-body-smallmedium-font);letter-spacing:var(--md-sys-typescale-body-smallmedium-tracking);display:block;margin:0;padding:0 var(--md-comp-card-padding-inline, 16px);color:var(--_card-color)}.micl-card__content{box-sizing:border-box;padding-block:var(--md-comp-card-content-padding-block, 16px);padding-inline:var(--md-comp-card-padding-inline, 16px);overflow:clip visible}.micl-card__actions{box-sizing:border-box;display:flex;flex-shrink:0;flex-wrap:wrap;gap:8px;padding-block:0 var(--md-comp-card-content-padding-block, 16px);padding-inline:var(--md-comp-card-padding-inline, 16px)}.micl-card__actions.micl-card__actions--outset-start{padding-inline-start:calc(var(--md-comp-card-padding-inline, 16px) - 16px)}.micl-card__actions.micl-card__actions--outset-end{padding-inline-end:calc(var(--md-comp-card-padding-inline, 16px) - 16px)}.micl-card--compact,summary.micl-card--compact{display:grid;grid-template-columns:20% 1fr;padding-block-end:0}.micl-card--compact .micl-card__image,summary.micl-card--compact .micl-card__image{grid-column:1;grid-row:1/span 4;block-size:100%;background-size:cover}.micl-card--compact [class*=micl-card__headline-],.micl-card--compact .micl-card__subhead,.micl-card--compact .micl-card__supporting-text,summary.micl-card--compact [class*=micl-card__headline-],summary.micl-card--compact .micl-card__subhead,summary.micl-card--compact .micl-card__supporting-text{grid-column:2;min-inline-size:0}.micl-card--compact [class*=micl-card__headline-],.micl-card--compact .micl-card__supporting-text,summary.micl-card--compact [class*=micl-card__headline-],summary.micl-card--compact .micl-card__supporting-text{margin-block-start:var(--md-comp-card-gap, 8px)}.micl-card--compact .micl-card__subhead,summary.micl-card--compact .micl-card__subhead{margin-block-start:0}.micl-card--compact .micl-card__content,summary.micl-card--compact .micl-card__content{grid-column:1/span 2}.micl-card--compact:not(:has(.micl-card__content))>:last-child,summary.micl-card--compact:not(:has(.micl-card__content))>:last-child{margin-block-end:var(--md-comp-card-gap, 8px)}
package/dist/chip.css CHANGED
@@ -1 +1 @@
1
- :root{--md-ref-typeface-plain: Google Sans, system-ui, sans-serif;--md-ref-typeface-plain-narrow: 0;--md-ref-typeface-brand: Google Sans, system-ui, sans-serif;--md-ref-typeface-weight-regular: 400;--md-ref-typeface-weight-medium: 500;--md-ref-typeface-weight-bold: 700}body{--md-sys-elevation-level0: none}body{--md-sys-elevation-level1: rgb(from var(--md-sys-color-shadow) r g b/0.3) 0 1px 2px 0, rgb(from var(--md-sys-color-shadow) r g b/0.15) 0 1px 3px 1px}body{--md-sys-elevation-level2: rgb(from var(--md-sys-color-shadow) r g b/0.3) 0 1px 2px 0, rgb(from var(--md-sys-color-shadow) r g b/0.15) 0 2px 6px 2px}:root{--md-sys-state-hover-state-layer-opacity: 8%}:root{--md-sys-state-focus-state-layer-opacity: 10%}:root{--md-sys-state-pressed-state-layer-opacity: 10%}:root{--md-sys-state-disabled-state-layer-opacity: 38%}:root{--md-sys-state-focus-indicator-thickness: 3px}:root{--md-sys-state-ripple-opacity-factor: 0.6}:root{--md-sys-state-ripple-duration: 750ms}@property --statelayer-color{syntax:"<color>";initial-value:rgba(0,0,0,0);inherits:false}@property --statelayer-opacity{syntax:"<percentage>";initial-value:0%;inherits:false}@keyframes micl-ripple{from{background-size:0% 0%,100%;animation-timing-function:cubic-bezier(0.2, 0, 0, 1)}60%{background-size:1000% 1000%,100%;animation-timing-function:cubic-bezier(0.3, 0, 1, 1)}to{background-size:10000% 10000%,100%}}:root{--md-sys-typescale-label-large-font: var(--md-ref-typeface-plain);--md-sys-typescale-label-large-size: 0.875rem;--md-sys-typescale-label-large-line-height: 1.25rem;--md-sys-typescale-label-large-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-label-large-tracking: 0.00625rem}.micl-chips .micl-chip-assist,.micl-chips .micl-chip-filter,.micl-chips .micl-chip-input,.micl-chips .micl-chip-suggestion,.micl-chips .micl-chip-input .micl-chip__primary,.micl-chips .micl-chip-input .micl-chip__remove{--md-comp-button-motion-effects: cubic-bezier(0.42, 1.67, 0.21, 0.9);--md-comp-button-motion-duration: 350ms;--micl-ripple: 1;box-sizing:border-box;position:relative;display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;padding:0;border:none;border-radius:calc(var(--micl-height)/2);background-image:radial-gradient(circle at var(--micl-x, center) var(--micl-y, center), transparent 0%, rgb(from var(--statelayer-color) r g b/calc(var(--statelayer-opacity) * var(--md-sys-state-ripple-opacity-factor))) 10%, transparent 10%),linear-gradient(rgb(from var(--statelayer-color) r g b/var(--statelayer-opacity)));background-repeat:no-repeat;background-position:var(--micl-x, center) var(--micl-y, center),0 0;background-size:0%,100%;-webkit-tap-highlight-color:rgba(0,0,0,0);cursor:pointer;transition:border-radius var(--md-comp-button-motion-duration) var(--md-comp-button-motion-effects),box-shadow var(--md-comp-button-motion-duration) var(--md-comp-button-motion-effects),background-size 0ms,--statelayer-opacity var(--md-comp-button-motion-duration) linear}.micl-chips .micl-chip-assist:is(:disabled,:has(input:disabled,>button:disabled)),.micl-chips .micl-chip-filter:is(:disabled,:has(input:disabled,>button:disabled)),.micl-chips .micl-chip-input:is(:disabled,:has(input:disabled,>button:disabled)),.micl-chips .micl-chip-suggestion:is(:disabled,:has(input:disabled,>button:disabled)),.micl-chips .micl-chip-input .micl-chip__primary:is(:disabled,:has(input:disabled,>button:disabled)),.micl-chips .micl-chip-input .micl-chip__remove:is(:disabled,:has(input:disabled,>button:disabled)){cursor:default}.micl-chips .micl-chip-assist:not(:disabled,:has(input:disabled,>button:disabled)):hover,.micl-chips .micl-chip-filter:not(:disabled,:has(input:disabled,>button:disabled)):hover,.micl-chips .micl-chip-input:not(:disabled,:has(input:disabled,>button:disabled)):hover,.micl-chips .micl-chip-suggestion:not(:disabled,:has(input:disabled,>button:disabled)):hover,.micl-chips .micl-chip-input .micl-chip__primary:not(:disabled,:has(input:disabled,>button:disabled)):hover,.micl-chips .micl-chip-input .micl-chip__remove:not(:disabled,:has(input:disabled,>button:disabled)):hover{--statelayer-opacity: var(--md-sys-state-hover-state-layer-opacity, 8%)}.micl-chips .micl-chip-assist:not(:disabled,:has(input:disabled,>button:disabled)):hover .micl-button__icon,.micl-chips .micl-chip-filter:not(:disabled,:has(input:disabled,>button:disabled)):hover .micl-button__icon,.micl-chips .micl-chip-input:not(:disabled,:has(input:disabled,>button:disabled)):hover .micl-button__icon,.micl-chips .micl-chip-suggestion:not(:disabled,:has(input:disabled,>button:disabled)):hover .micl-button__icon,.micl-chips .micl-chip-input .micl-chip__primary:not(:disabled,:has(input:disabled,>button:disabled)):hover .micl-button__icon,.micl-chips .micl-chip-input .micl-chip__remove:not(:disabled,:has(input:disabled,>button:disabled)):hover .micl-button__icon{font-variation-settings:"FILL" 1}.micl-chips .micl-chip-assist:not(:disabled,:has(input:disabled,>button:disabled)):is(:focus-visible,:has(input:focus-visible)),.micl-chips .micl-chip-filter:not(:disabled,:has(input:disabled,>button:disabled)):is(:focus-visible,:has(input:focus-visible)),.micl-chips .micl-chip-input:not(:disabled,:has(input:disabled,>button:disabled)):is(:focus-visible,:has(input:focus-visible)),.micl-chips .micl-chip-suggestion:not(:disabled,:has(input:disabled,>button:disabled)):is(:focus-visible,:has(input:focus-visible)),.micl-chips .micl-chip-input .micl-chip__primary:not(:disabled,:has(input:disabled,>button:disabled)):is(:focus-visible,:has(input:focus-visible)),.micl-chips .micl-chip-input .micl-chip__remove:not(:disabled,:has(input:disabled,>button:disabled)):is(:focus-visible,:has(input:focus-visible)){--statelayer-opacity: var(--md-sys-state-focus-state-layer-opacity, 10%);outline:var(--md-sys-state-focus-indicator-thickness, 3px) solid var(--md-sys-color-secondary);outline-offset:2px}.micl-chips .micl-chip-assist:not(:disabled,:has(input:disabled,>button:disabled)):active,.micl-chips .micl-chip-filter:not(:disabled,:has(input:disabled,>button:disabled)):active,.micl-chips .micl-chip-input:not(:disabled,:has(input:disabled,>button:disabled)):active,.micl-chips .micl-chip-suggestion:not(:disabled,:has(input:disabled,>button:disabled)):active,.micl-chips .micl-chip-input .micl-chip__primary:not(:disabled,:has(input:disabled,>button:disabled)):active,.micl-chips .micl-chip-input .micl-chip__remove:not(:disabled,:has(input:disabled,>button:disabled)):active{--statelayer-opacity: var(--md-sys-state-pressed-state-layer-opacity, 10%)}.micl-chips .micl-chip-assist:not(:disabled,:has(input:disabled,>button:disabled)).micl-rippling,.micl-chips .micl-chip-filter:not(:disabled,:has(input:disabled,>button:disabled)).micl-rippling,.micl-chips .micl-chip-input:not(:disabled,:has(input:disabled,>button:disabled)).micl-rippling,.micl-chips .micl-chip-suggestion:not(:disabled,:has(input:disabled,>button:disabled)).micl-rippling,.micl-chips .micl-chip-input .micl-chip__primary:not(:disabled,:has(input:disabled,>button:disabled)).micl-rippling,.micl-chips .micl-chip-input .micl-chip__remove:not(:disabled,:has(input:disabled,>button:disabled)).micl-rippling{animation:micl-ripple calc(var(--md-sys-state-ripple-duration)*1.333)}.micl-chips .micl-chip-assist .micl-button__icon,.micl-chips .micl-chip-filter .micl-button__icon,.micl-chips .micl-chip-input .micl-button__icon,.micl-chips .micl-chip-suggestion .micl-button__icon{font-variation-settings:"FILL" 0;transition:font-variation-settings var(--md-comp-button-motion-duration) linear}.micl-chips .micl-button--toggle.micl-chip-assist:not([aria-pressed=true]) .micl-button__icon::before,.micl-chips .micl-button--toggle.micl-chip-filter:not([aria-pressed=true]) .micl-button__icon::before,.micl-chips .micl-button--toggle.micl-chip-input:not([aria-pressed=true]) .micl-button__icon::before,.micl-chips .micl-button--toggle.micl-chip-suggestion:not([aria-pressed=true]) .micl-button__icon::before,.micl-chips .micl-chip-input .micl-button--toggle.micl-chip__primary:not([aria-pressed=true]) .micl-button__icon::before,.micl-chips .micl-chip-input .micl-button--toggle.micl-chip__remove:not([aria-pressed=true]) .micl-button__icon::before{content:attr(data-miclicon)}.micl-chips .micl-button--toggle[aria-pressed=true].micl-chip-assist .micl-button__icon::before,.micl-chips .micl-button--toggle[aria-pressed=true].micl-chip-filter .micl-button__icon::before,.micl-chips .micl-button--toggle[aria-pressed=true].micl-chip-input .micl-button__icon::before,.micl-chips .micl-button--toggle[aria-pressed=true].micl-chip-suggestion .micl-button__icon::before,.micl-chips .micl-chip-input .micl-button--toggle[aria-pressed=true].micl-chip__primary .micl-button__icon::before,.micl-chips .micl-chip-input .micl-button--toggle[aria-pressed=true].micl-chip__remove .micl-button__icon::before{content:attr(data-micliconselected)}.micl-chips .micl-chip-assist::before,.micl-chips .micl-chip-filter::before,.micl-chips .micl-chip-input::before,.micl-chips .micl-chip-suggestion::before{content:"";position:absolute;block-size:var(--md-sys-target-size, 48px);inline-size:100%;min-inline-size:var(--md-sys-target-size, 48px);inset:calc((var(--micl-height) - var(--md-sys-target-size, 48px))/2) 0 0 calc((min(100%,var(--md-sys-target-size, 48px)) - var(--md-sys-target-size, 48px))/2);background-color:rgba(0,0,0,0)}.micl-chips .micl-chip-assist,.micl-chips .micl-chip-filter,.micl-chips .micl-chip-input,.micl-chips .micl-chip-suggestion{font-family:var(--md-sys-typescale-label-large-font);font-size:var(--md-sys-typescale-label-large-size);line-height:var(--md-sys-typescale-label-large-line-height);font-weight:var(--md-sys-typescale-label-large-weight);letter-spacing:var(--md-sys-typescale-label-large-tracking);--micl-width: 32px;--micl-height: 32px;min-inline-size:var(--micl-width);block-size:var(--micl-height);min-block-size:var(--micl-height);column-gap:4px;padding-inline:12px}.micl-chips .micl-chip-assist .micl-button__icon,.micl-chips .micl-chip-filter .micl-button__icon,.micl-chips .micl-chip-input .micl-button__icon,.micl-chips .micl-chip-suggestion .micl-button__icon{font-size:20px;inline-size:20px}.micl-chips .micl-chip--elevated{--statelayer-color: var(--md-sys-color-primary);background-color:var(--md-comp-elevated-button-container-color, var(--md-sys-color-surface-container-low));color:var(--md-comp-elevated-button-label-text-color, var(--md-sys-color-primary));box-shadow:var(--md-comp-elevated-button-container-elevation, var(--md-sys-elevation-level1))}.micl-chips .micl-chip--elevated:is(:disabled,:has(input:disabled,>button:disabled)){background-color:var(--md-comp-elevated-button-disabled-container-color, rgb(from var(--md-sys-color-on-surface) r g b/var(--md-comp-elevated-button-disabled-container-opacity, 10%)));color:var(--md-comp-elevated-button-disabled-label-text-color, rgb(from var(--md-sys-color-on-surface-variant) r g b/var(--md-comp-elevated-button-disabled-label-text-opacity, 38%)));box-shadow:var(--md-sys-elevation-level0)}.micl-chips .micl-chip--elevated:not(:disabled,:has(input:disabled,>button:disabled)):hover:not(:active){box-shadow:var(--md-sys-elevation-level2)}.micl-chips .micl-chip--elevated:not(:disabled,:has(input:disabled,>button:disabled)).micl-button--toggle[aria-pressed=true]{--statelayer-color: var(--md-sys-color-on-primary);background-color:var(--md-comp-elevated-button-selected-container-color, var(--md-sys-color-primary));color:var(--md-comp-elevated-button-selected-label-text-color, var(--md-sys-color-on-primary))}.micl-chips .micl-chip--elevated:not(:disabled,:has(input:disabled,>button:disabled)).micl-button--toggle[aria-pressed=true] .micl-button__icon{font-variation-settings:"FILL" 1}.micl-chips .micl-chip-assist:not(.micl-chip--elevated),.micl-chips .micl-chip-filter:not(.micl-chip--elevated),.micl-chips .micl-chip-input:not(.micl-chip--elevated),.micl-chips .micl-chip-suggestion:not(.micl-chip--elevated){--statelayer-color: var(--md-sys-color-on-surface-variant);background-color:rgba(0,0,0,0);color:var(--md-comp-outlined-button-label-text-color, var(--md-sys-color-on-surface-variant));border:1px solid var(--md-comp-outlined-button-outline-color, var(--md-sys-color-outline-variant))}.micl-chips .micl-chip-assist:is(:disabled,:has(input:disabled,>button:disabled)):not(.micl-chip--elevated),.micl-chips .micl-chip-filter:is(:disabled,:has(input:disabled,>button:disabled)):not(.micl-chip--elevated),.micl-chips .micl-chip-input:is(:disabled,:has(input:disabled,>button:disabled)):not(.micl-chip--elevated),.micl-chips .micl-chip-suggestion:is(:disabled,:has(input:disabled,>button:disabled)):not(.micl-chip--elevated){background-color:rgba(0,0,0,0);color:var(--md-comp-outlined-button-disabled-label-text-color, rgb(from var(--md-sys-color-on-surface-variant) r g b/var(--md-comp-outlined-button-disabled-label-text-opacity, 38%)))}.micl-chips .micl-chip-assist:is(:disabled,:has(input:disabled,>button:disabled)).micl-button--toggle[aria-pressed=true]:not(.micl-chip--elevated),.micl-chips .micl-chip-filter:is(:disabled,:has(input:disabled,>button:disabled)).micl-button--toggle[aria-pressed=true]:not(.micl-chip--elevated),.micl-chips .micl-chip-input:is(:disabled,:has(input:disabled,>button:disabled)).micl-button--toggle[aria-pressed=true]:not(.micl-chip--elevated),.micl-chips .micl-chip-suggestion:is(:disabled,:has(input:disabled,>button:disabled)).micl-button--toggle[aria-pressed=true]:not(.micl-chip--elevated){border:none;background-color:var(--md-comp-outlined-button-selected-disabled-container-color, rgb(from var(--md-sys-color-on-surface) r g b/var(--md-comp-outlined-button-selected-disabled-container-opacity, 10%)))}.micl-chips .micl-chip-assist:not(:disabled,:has(input:disabled,>button:disabled)).micl-button--toggle[aria-pressed=true]:not(.micl-chip--elevated),.micl-chips .micl-chip-filter:not(:disabled,:has(input:disabled,>button:disabled)).micl-button--toggle[aria-pressed=true]:not(.micl-chip--elevated),.micl-chips .micl-chip-input:not(:disabled,:has(input:disabled,>button:disabled)).micl-button--toggle[aria-pressed=true]:not(.micl-chip--elevated),.micl-chips .micl-chip-suggestion:not(:disabled,:has(input:disabled,>button:disabled)).micl-button--toggle[aria-pressed=true]:not(.micl-chip--elevated){--statelayer-color: var(--md-sys-color-inverse-on-surface);border:none;background-color:var(--md-comp-outlined-button-selected-container-color, var(--md-sys-color-inverse-surface));color:var(--md-comp-outlined-button-selected-label-text-color, var(--md-sys-color-inverse-on-surface))}.micl-chips .micl-chip-assist:not(:disabled,:has(input:disabled,>button:disabled)).micl-button--toggle[aria-pressed=true]:not(.micl-chip--elevated) .micl-button__icon,.micl-chips .micl-chip-filter:not(:disabled,:has(input:disabled,>button:disabled)).micl-button--toggle[aria-pressed=true]:not(.micl-chip--elevated) .micl-button__icon,.micl-chips .micl-chip-input:not(:disabled,:has(input:disabled,>button:disabled)).micl-button--toggle[aria-pressed=true]:not(.micl-chip--elevated) .micl-button__icon,.micl-chips .micl-chip-suggestion:not(:disabled,:has(input:disabled,>button:disabled)).micl-button--toggle[aria-pressed=true]:not(.micl-chip--elevated) .micl-button__icon{font-variation-settings:"FILL" 1}:root{--md-sys-shape-corner-small: 8px}:root{--md-sys-shape-corner-full: 50%}:root{--md-sys-typescale-title-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-title-medium-size: 1rem;--md-sys-typescale-title-medium-line-height: 1.5rem;--md-sys-typescale-title-medium-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-title-medium-tracking: 0.0125rem}.micl-chips{display:flex;align-items:flex-start;flex-wrap:wrap;gap:8px;margin:0;padding:0;border:none}.micl-chips .micl-chips__headline{padding-block-end:4px;color:var(--md-sys-color-on-surface-variant)}.micl-chips .micl-chip-assist{--micl-chip-statelayer: var(--md-sys-color-on-surface);--micl-chip-label: var(--md-comp-assist-chip-label-text-color, var(--md-sys-color-on-surface));--micl-chip-icon: var(--md-comp-assist-chip-leading-icon-color);--micl-chip-outline: var(--md-comp-assist-chip-outline-color);--micl-chip-disabled-label: var(--md-comp-assist-chip-disabled-label-text-color);--micl-chip-disabled-outline: var(--md-comp-assist-chip-disabled-outline-color);--micl-chip-elevated-container: var(--md-comp-assist-chip-elevated-container-color)}.micl-chips .micl-chip-filter{--micl-chip-label: var(--md-comp-filter-chip-label-text-color);--micl-chip-icon: var(--md-comp-filter-chip-leading-icon-color);--micl-chip-outline: var(--md-comp-filter-chip-outline-color);--micl-chip-disabled-label: var(--md-comp-filter-chip-disabled-label-text-color);--micl-chip-disabled-outline: var(--md-comp-filter-chip-disabled-outline-color);--micl-chip-elevated-container: var(--md-comp-filter-chip-elevated-container-color)}.micl-chips .micl-chip-suggestion{--micl-chip-label: var(--md-comp-suggestion-chip-label-text-color);--micl-chip-icon: var(--md-comp-suggestion-chip-leading-icon-color);--micl-chip-outline: var(--md-comp-suggestion-chip-outline-color);--micl-chip-disabled-label: var(--md-comp-suggestion-chip-disabled-label-text-color);--micl-chip-disabled-outline: var(--md-comp-suggestion-chip-disabled-outline-color);--micl-chip-elevated-container: var(--md-comp-suggestion-chip-elevated-container-color)}.micl-chips .micl-chip-assist,.micl-chips .micl-chip-filter,.micl-chips .micl-chip-input,.micl-chips .micl-chip-suggestion{--md-comp-elevated-button-label-text-color: var(--micl-chip-label, var(--md-sys-color-on-surface-variant));--md-comp-outlined-button-label-text-color: var(--micl-chip-label, var(--md-sys-color-on-surface-variant));--md-comp-elevated-button-disabled-container-opacity: 12%;--md-comp-elevated-button-disabled-label-text-color: var(--micl-chip-disabled-label, rgb(from var(--md-sys-color-on-surface) r g b / 38%));--md-comp-outlined-button-disabled-label-text-color: var(--micl-chip-disabled-label, rgb(from var(--md-sys-color-on-surface) r g b / 38%));border-radius:var(--md-sys-shape-corner-small);padding-inline:16px;column-gap:8px}.micl-chips .micl-chip-assist:has(>.micl-button__icon:first-child),.micl-chips .micl-chip-filter:has(>.micl-button__icon:first-child),.micl-chips .micl-chip-input:has(>.micl-button__icon:first-child),.micl-chips .micl-chip-suggestion:has(>.micl-button__icon:first-child){padding-inline-start:8px}.micl-chips .micl-chip-assist:has(>.micl-button__icon:last-child),.micl-chips .micl-chip-filter:has(>.micl-button__icon:last-child),.micl-chips .micl-chip-input:has(>.micl-button__icon:last-child),.micl-chips .micl-chip-suggestion:has(>.micl-button__icon:last-child){padding-inline-end:8px}.micl-chips .micl-chip-assist .micl-button__icon,.micl-chips .micl-chip-filter .micl-button__icon,.micl-chips .micl-chip-input .micl-button__icon,.micl-chips .micl-chip-suggestion .micl-button__icon{font-size:18px;inline-size:18px;overflow:hidden;transition:inline-size 150ms cubic-bezier(0.31, 0.94, 0.34, 1)}.micl-chips .micl-chip-assist:not(:disabled,:has(input:disabled,>button:disabled)) .micl-button__icon,.micl-chips .micl-chip-filter:not(:disabled,:has(input:disabled,>button:disabled)) .micl-button__icon,.micl-chips .micl-chip-input:not(:disabled,:has(input:disabled,>button:disabled)) .micl-button__icon,.micl-chips .micl-chip-suggestion:not(:disabled,:has(input:disabled,>button:disabled)) .micl-button__icon{color:var(--micl-chip-icon, var(--md-sys-color-primary))}.micl-chips .micl-chip-assist:not(.micl-chip--elevated),.micl-chips .micl-chip-filter:not(.micl-chip--elevated),.micl-chips .micl-chip-input:not(.micl-chip--elevated),.micl-chips .micl-chip-suggestion:not(.micl-chip--elevated){--statelayer-color: var(--micl-chip-statelayer, var(--md-sys-color-on-surface-variant));--md-comp-outlined-button-outline-color: var(--micl-chip-outline, var(--md-sys-color-outline-variant))}.micl-chips .micl-chip-assist:not(.micl-chip--elevated):is(:disabled,:has(input:disabled,>button:disabled)),.micl-chips .micl-chip-filter:not(.micl-chip--elevated):is(:disabled,:has(input:disabled,>button:disabled)),.micl-chips .micl-chip-input:not(.micl-chip--elevated):is(:disabled,:has(input:disabled,>button:disabled)),.micl-chips .micl-chip-suggestion:not(.micl-chip--elevated):is(:disabled,:has(input:disabled,>button:disabled)){border-color:var(--micl-chip-disabled-outline, rgb(from var(--md-sys-color-on-surface) r g b/12%))}.micl-chips .micl-chip-input{--micl-chip-label: var(--md-comp-input-chip-label-text-color);--micl-chip-icon: var(--md-comp-input-chip-leading-icon-color, currentColor);--micl-chip-outline: var(--md-comp-input-chip-outline-color);--micl-chip-disabled-label: var(--md-comp-input-chip-disabled-label-text-color);--micl-chip-disabled-outline: var(--md-comp-input-chip-disabled-outline-color);padding-inline:0;column-gap:0;cursor:default}.micl-chips .micl-chip-input:has(>.micl-chip__primary:focus-visible){--statelayer-opacity: var(--md-sys-state-focus-state-layer-opacity, 10%);outline:var(--md-sys-state-focus-indicator-thickness, 3px) solid var(--md-sys-color-secondary);outline-offset:2px}.micl-chips .micl-chip-input:not(:disabled,:has(input:disabled,>button:disabled)):has(>.micl-chip__remove:is(:hover,:active)){--statelayer-opacity: 0%}.micl-chips .micl-chip-input:has(>:disabled) .micl-chip__avatar{opacity:var(--md-comp-input-chip-disabled-avatar-opacity, 38%)}.micl-chips .micl-chip-input:has(.micl-chip__avatar){border-radius:calc(var(--micl-height)/2)}.micl-chips .micl-chip-input:has(.micl-chip__avatar) .micl-chip__primary{border-start-start-radius:calc(var(--micl-height)/2 - 1px);border-end-start-radius:calc(var(--micl-height)/2 - 1px)}.micl-chips .micl-chip-input .micl-chip__primary,.micl-chips .micl-chip-input .micl-chip__remove{--statelayer-color: var(--micl-chip-statelayer, var(--md-sys-color-on-surface-variant));color:inherit;background-color:rgba(0,0,0,0)}.micl-chips .micl-chip-input .micl-chip__primary{background-image:radial-gradient(circle at var(--micl-x, center) var(--micl-y, center), transparent 0%, rgb(from var(--statelayer-color) r g b/calc(var(--statelayer-opacity) * var(--md-sys-state-ripple-opacity-factor))) 10%, transparent 10%);block-size:100%;column-gap:8px;padding-inline:12px 5px;border-start-start-radius:calc(var(--md-sys-shape-corner-small) - 1px);border-end-start-radius:calc(var(--md-sys-shape-corner-small) - 1px);border-start-end-radius:0;border-end-end-radius:0;font:inherit}.micl-chips .micl-chip-input .micl-chip__primary:has(>.micl-button__icon:first-child){padding-inline-start:8px}.micl-chips .micl-chip-input .micl-chip__primary:has(>.micl-chip__avatar:first-child){padding-inline-start:4px}.micl-chips .micl-chip-input .micl-chip__primary:not(:disabled,:has(input:disabled,>button:disabled)):is(:focus-visible,:has(input:focus-visible)){outline:none}.micl-chips .micl-chip-input .micl-chip__primary::before{content:"";position:absolute;inset-block-start:calc((100% - var(--md-sys-target-size, 48px))/2);inset-inline-start:0;block-size:var(--md-sys-target-size, 48px);inline-size:100%}.micl-chips .micl-chip-input .micl-chip__remove{inline-size:24px;block-size:24px;margin-inline:0 5px;border-radius:50%;font-size:18px}.micl-chips .micl-chip-input .micl-chip__remove:not(:disabled,:has(input:disabled,>button:disabled)){color:var(--md-comp-input-chip-trailing-icon-color, var(--md-comp-input-chip-leading-icon-color, currentColor))}.micl-chips .micl-chip-input .micl-chip__remove::before{content:"";position:absolute;inset-block-start:calc((100% - var(--md-sys-target-size, 48px))/2);inset-inline-start:calc((100% - var(--md-sys-target-size, 48px))/2);block-size:var(--md-sys-target-size, 48px);inline-size:var(--md-sys-target-size, 48px)}.micl-chips .micl-chip-input .micl-chip__avatar{font-family:var(--md-sys-typescale-title-medium-font);font-size:var(--md-sys-typescale-title-medium-size);line-height:var(--md-sys-typescale-title-medium-line-height);font-weight:var(--md-sys-typescale-title-medium-weight);letter-spacing:var(--md-sys-typescale-title-medium-tracking);display:flex;align-items:center;justify-content:center;block-size:var(--md-comp-input-chip-avatar-size, 24px);inline-size:var(--md-comp-input-chip-avatar-size, 24px);border-radius:var(--md-comp-input-chip-avatar-shape, var(--md-sys-shape-corner-full, 50%));color:var(--md-comp-input-chip-avatar-label-color, var(--md-sys-color-on-primary-container));background-color:var(--md-comp-input-chip-avatar-color, var(--md-sys-color-primary-container));object-fit:cover;object-position:center}.micl-chips .micl-chip-filter input{position:absolute;inset:0;margin:0;opacity:0;cursor:inherit}.micl-chips .micl-chip-filter .micl-button__icon+.micl-button__icon{margin-inline-start:-8px}.micl-chips .micl-chip-filter .micl-button__icon+.micl-button__icon:dir(rtl){margin-inline:0 -8px}.micl-chips .micl-chip-filter:has(input:not(:checked)) .micl-button__icon:has(+input){inline-size:0px}.micl-chips .micl-chip-filter:has(input:checked) .micl-button__icon:not(:has(+input)){inline-size:0px}.micl-chips .micl-chip-filter:has(input:checked){--micl-chip-statelayer: var(--md-sys-color-on-secondary-container);--micl-chip-label: var(--md-comp-filter-chip-selected-label-text-color, var(--md-sys-color-on-secondary-container));--micl-chip-icon: var(--md-comp-filter-chip-selected-leading-icon-color, var(--md-sys-color-on-secondary-container));--micl-chip-outline: var(--md-comp-filter-chip-selected-container-color, var(--md-sys-color-secondary-container));border-color:rgba(0,0,0,0);background-color:var(--md-comp-filter-chip-selected-container-color, var(--md-sys-color-secondary-container))}.micl-chips .micl-chip-filter:has(input:checked):not(.micl-chip--elevated):not(:disabled,:has(input:disabled,>button:disabled)):hover:not(:active){box-shadow:var(--md-sys-elevation-level1)}.micl-chips .micl-chip-filter:not(.micl-chip--elevated):has(input:disabled:checked){background-color:var(--md-comp-filter-chip-disabled-selected-container-color, rgb(from var(--md-sys-color-on-surface) r g b/var(--md-comp-filter-chip-disabled-selected-container-opacity, 12%)))}.micl-chips .micl-chip--elevated{--statelayer-color: var(--micl-chip-statelayer, var(--md-sys-color-on-surface-variant));--md-comp-elevated-button-container-color: var(--micl-chip-elevated-container, var(--md-sys-color-surface-container-low))}.micl-chips--input{min-inline-size:0;flex-wrap:nowrap;min-inline-size:0;padding:10px 16px 13px;border:1px solid var(--md-comp-outlined-button-outline-color, var(--md-sys-color-outline-variant));border-radius:var(--md-sys-shape-corner-small);overflow-x:auto;scrollbar-width:thin}.micl-chips .micl-chip__remove:dir(rtl){margin-inline:5px 0}
1
+ :root{--md-ref-typeface-plain: Google Sans, system-ui, sans-serif;--md-ref-typeface-plain-narrow: 0;--md-ref-typeface-brand: Google Sans, system-ui, sans-serif;--md-ref-typeface-weight-regular: 400;--md-ref-typeface-weight-medium: 500;--md-ref-typeface-weight-bold: 700}body{--md-sys-elevation-level0: none}body{--md-sys-elevation-level1: rgb(from var(--md-sys-color-shadow) r g b/0.3) 0 1px 2px 0, rgb(from var(--md-sys-color-shadow) r g b/0.15) 0 1px 3px 1px}body{--md-sys-elevation-level2: rgb(from var(--md-sys-color-shadow) r g b/0.3) 0 1px 2px 0, rgb(from var(--md-sys-color-shadow) r g b/0.15) 0 2px 6px 2px}:root{--md-sys-state-hover-state-layer-opacity: 8%}:root{--md-sys-state-focus-state-layer-opacity: 10%}:root{--md-sys-state-pressed-state-layer-opacity: 10%}:root{--md-sys-state-disabled-state-layer-opacity: 38%}:root{--md-sys-state-focus-indicator-thickness: 3px}:root{--md-sys-state-ripple-opacity-factor: 0.6}:root{--md-sys-state-ripple-duration: 750ms}@property --statelayer-color{syntax:"<color>";initial-value:rgba(0,0,0,0);inherits:false}@property --statelayer-opacity{syntax:"<percentage>";initial-value:0%;inherits:false}@keyframes micl-ripple{from{background-size:0% 0%,100%;animation-timing-function:cubic-bezier(0.2, 0, 0, 1)}60%{background-size:1000% 1000%,100%;animation-timing-function:cubic-bezier(0.3, 0, 1, 1)}to{background-size:10000% 10000%,100%}}:root{--md-sys-typescale-label-large-font: var(--md-ref-typeface-plain);--md-sys-typescale-label-large-size: 0.875rem;--md-sys-typescale-label-large-line-height: 1.25rem;--md-sys-typescale-label-large-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-label-large-tracking: 0.00625rem}.micl-chips .micl-chip-assist,.micl-chips .micl-chip-filter,.micl-chips .micl-chip-input,.micl-chips .micl-chip-suggestion,.micl-chips .micl-chip-input .micl-chip__primary,.micl-chips .micl-chip-input .micl-chip__remove{--md-comp-button-motion-effects: cubic-bezier(0.42, 1.67, 0.21, 0.9);--md-comp-button-motion-duration: 350ms;--micl-ripple: 1;box-sizing:border-box;position:relative;display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;padding:0;border:none;border-radius:calc(var(--micl-height)/2);background-image:radial-gradient(circle at var(--micl-x, center) var(--micl-y, center), transparent 0%, rgb(from var(--statelayer-color) r g b/calc(var(--statelayer-opacity) * var(--md-sys-state-ripple-opacity-factor))) 10%, transparent 10%),linear-gradient(rgb(from var(--statelayer-color) r g b/var(--statelayer-opacity)));background-repeat:no-repeat;background-position:var(--micl-x, center) var(--micl-y, center),0 0;background-size:0%,100%;-webkit-tap-highlight-color:rgba(0,0,0,0);cursor:pointer;transition:border-radius var(--md-comp-button-motion-duration) var(--md-comp-button-motion-effects),box-shadow var(--md-comp-button-motion-duration) var(--md-comp-button-motion-effects),background-size 0ms,--statelayer-opacity var(--md-comp-button-motion-duration) linear}.micl-chips .micl-chip-assist:is(:disabled,:has(input:disabled,>button:disabled)),.micl-chips .micl-chip-filter:is(:disabled,:has(input:disabled,>button:disabled)),.micl-chips .micl-chip-input:is(:disabled,:has(input:disabled,>button:disabled)),.micl-chips .micl-chip-suggestion:is(:disabled,:has(input:disabled,>button:disabled)),.micl-chips .micl-chip-input .micl-chip__primary:is(:disabled,:has(input:disabled,>button:disabled)),.micl-chips .micl-chip-input .micl-chip__remove:is(:disabled,:has(input:disabled,>button:disabled)){cursor:default}.micl-chips .micl-chip-assist:not(:disabled,:has(input:disabled,>button:disabled)):hover,.micl-chips .micl-chip-filter:not(:disabled,:has(input:disabled,>button:disabled)):hover,.micl-chips .micl-chip-input:not(:disabled,:has(input:disabled,>button:disabled)):hover,.micl-chips .micl-chip-suggestion:not(:disabled,:has(input:disabled,>button:disabled)):hover,.micl-chips .micl-chip-input .micl-chip__primary:not(:disabled,:has(input:disabled,>button:disabled)):hover,.micl-chips .micl-chip-input .micl-chip__remove:not(:disabled,:has(input:disabled,>button:disabled)):hover{--statelayer-opacity: var(--md-sys-state-hover-state-layer-opacity, 8%)}.micl-chips .micl-chip-assist:not(:disabled,:has(input:disabled,>button:disabled)):hover .micl-button__icon,.micl-chips .micl-chip-filter:not(:disabled,:has(input:disabled,>button:disabled)):hover .micl-button__icon,.micl-chips .micl-chip-input:not(:disabled,:has(input:disabled,>button:disabled)):hover .micl-button__icon,.micl-chips .micl-chip-suggestion:not(:disabled,:has(input:disabled,>button:disabled)):hover .micl-button__icon,.micl-chips .micl-chip-input .micl-chip__primary:not(:disabled,:has(input:disabled,>button:disabled)):hover .micl-button__icon,.micl-chips .micl-chip-input .micl-chip__remove:not(:disabled,:has(input:disabled,>button:disabled)):hover .micl-button__icon{font-variation-settings:"FILL" 1}.micl-chips .micl-chip-assist:not(:disabled,:has(input:disabled,>button:disabled)):is(:focus-visible,:has(input:focus-visible)),.micl-chips .micl-chip-filter:not(:disabled,:has(input:disabled,>button:disabled)):is(:focus-visible,:has(input:focus-visible)),.micl-chips .micl-chip-input:not(:disabled,:has(input:disabled,>button:disabled)):is(:focus-visible,:has(input:focus-visible)),.micl-chips .micl-chip-suggestion:not(:disabled,:has(input:disabled,>button:disabled)):is(:focus-visible,:has(input:focus-visible)),.micl-chips .micl-chip-input .micl-chip__primary:not(:disabled,:has(input:disabled,>button:disabled)):is(:focus-visible,:has(input:focus-visible)),.micl-chips .micl-chip-input .micl-chip__remove:not(:disabled,:has(input:disabled,>button:disabled)):is(:focus-visible,:has(input:focus-visible)){--statelayer-opacity: var(--md-sys-state-focus-state-layer-opacity, 10%);outline:var(--md-sys-state-focus-indicator-thickness, 3px) solid var(--md-sys-color-secondary);outline-offset:2px}.micl-chips .micl-chip-assist:not(:disabled,:has(input:disabled,>button:disabled)):active,.micl-chips .micl-chip-filter:not(:disabled,:has(input:disabled,>button:disabled)):active,.micl-chips .micl-chip-input:not(:disabled,:has(input:disabled,>button:disabled)):active,.micl-chips .micl-chip-suggestion:not(:disabled,:has(input:disabled,>button:disabled)):active,.micl-chips .micl-chip-input .micl-chip__primary:not(:disabled,:has(input:disabled,>button:disabled)):active,.micl-chips .micl-chip-input .micl-chip__remove:not(:disabled,:has(input:disabled,>button:disabled)):active{--statelayer-opacity: var(--md-sys-state-pressed-state-layer-opacity, 10%)}.micl-chips .micl-chip-assist:not(:disabled,:has(input:disabled,>button:disabled)).micl-rippling,.micl-chips .micl-chip-filter:not(:disabled,:has(input:disabled,>button:disabled)).micl-rippling,.micl-chips .micl-chip-input:not(:disabled,:has(input:disabled,>button:disabled)).micl-rippling,.micl-chips .micl-chip-suggestion:not(:disabled,:has(input:disabled,>button:disabled)).micl-rippling,.micl-chips .micl-chip-input .micl-chip__primary:not(:disabled,:has(input:disabled,>button:disabled)).micl-rippling,.micl-chips .micl-chip-input .micl-chip__remove:not(:disabled,:has(input:disabled,>button:disabled)).micl-rippling{animation:micl-ripple calc(var(--md-sys-state-ripple-duration)*1.333)}.micl-chips .micl-chip-assist .micl-button__icon,.micl-chips .micl-chip-filter .micl-button__icon,.micl-chips .micl-chip-input .micl-button__icon,.micl-chips .micl-chip-suggestion .micl-button__icon{font-variation-settings:"FILL" 0;transition:font-variation-settings var(--md-comp-button-motion-duration) linear}.micl-chips .micl-button--toggle.micl-chip-assist:not([aria-pressed=true]) .micl-button__icon::before,.micl-chips .micl-button--toggle.micl-chip-filter:not([aria-pressed=true]) .micl-button__icon::before,.micl-chips .micl-button--toggle.micl-chip-input:not([aria-pressed=true]) .micl-button__icon::before,.micl-chips .micl-button--toggle.micl-chip-suggestion:not([aria-pressed=true]) .micl-button__icon::before,.micl-chips .micl-chip-input .micl-button--toggle.micl-chip__primary:not([aria-pressed=true]) .micl-button__icon::before,.micl-chips .micl-chip-input .micl-button--toggle.micl-chip__remove:not([aria-pressed=true]) .micl-button__icon::before{content:attr(data-miclicon)}.micl-chips .micl-button--toggle[aria-pressed=true].micl-chip-assist .micl-button__icon::before,.micl-chips .micl-button--toggle[aria-pressed=true].micl-chip-filter .micl-button__icon::before,.micl-chips .micl-button--toggle[aria-pressed=true].micl-chip-input .micl-button__icon::before,.micl-chips .micl-button--toggle[aria-pressed=true].micl-chip-suggestion .micl-button__icon::before,.micl-chips .micl-chip-input .micl-button--toggle[aria-pressed=true].micl-chip__primary .micl-button__icon::before,.micl-chips .micl-chip-input .micl-button--toggle[aria-pressed=true].micl-chip__remove .micl-button__icon::before{content:attr(data-micliconselected)}.micl-chips .micl-chip-assist::before,.micl-chips .micl-chip-filter::before,.micl-chips .micl-chip-input::before,.micl-chips .micl-chip-suggestion::before{content:"";position:absolute;block-size:var(--md-sys-target-size, 48px);inline-size:100%;min-inline-size:var(--md-sys-target-size, 48px);inset:calc((var(--micl-height) - var(--md-sys-target-size, 48px))/2) 0 0 calc((min(100%,var(--md-sys-target-size, 48px)) - var(--md-sys-target-size, 48px))/2);background-color:rgba(0,0,0,0)}.micl-chips .micl-chip-assist,.micl-chips .micl-chip-filter,.micl-chips .micl-chip-input,.micl-chips .micl-chip-suggestion{font:var(--md-sys-typescale-label-large-weight) var(--md-sys-typescale-label-large-size)/var(--md-sys-typescale-label-large-line-height) var(--md-sys-typescale-label-large-font);letter-spacing:var(--md-sys-typescale-label-large-tracking);--micl-width: 32px;--micl-height: 32px;min-inline-size:var(--micl-width);block-size:var(--micl-height);min-block-size:var(--micl-height);column-gap:4px;padding-inline:12px}.micl-chips .micl-chip-assist .micl-button__icon,.micl-chips .micl-chip-filter .micl-button__icon,.micl-chips .micl-chip-input .micl-button__icon,.micl-chips .micl-chip-suggestion .micl-button__icon{font-size:20px;inline-size:20px}.micl-chips .micl-chip--elevated{--statelayer-color: var(--md-sys-color-primary);background-color:var(--md-comp-elevated-button-container-color, var(--md-sys-color-surface-container-low));color:var(--md-comp-elevated-button-label-text-color, var(--md-sys-color-primary));box-shadow:var(--md-comp-elevated-button-container-elevation, var(--md-sys-elevation-level1))}.micl-chips .micl-chip--elevated:is(:disabled,:has(input:disabled,>button:disabled)){background-color:var(--md-comp-elevated-button-disabled-container-color, rgb(from var(--md-sys-color-on-surface) r g b/var(--md-comp-elevated-button-disabled-container-opacity, 10%)));color:var(--md-comp-elevated-button-disabled-label-text-color, rgb(from var(--md-sys-color-on-surface-variant) r g b/var(--md-comp-elevated-button-disabled-label-text-opacity, 38%)));box-shadow:var(--md-sys-elevation-level0)}.micl-chips .micl-chip--elevated:not(:disabled,:has(input:disabled,>button:disabled)):hover:not(:active){box-shadow:var(--md-sys-elevation-level2)}.micl-chips .micl-chip--elevated:not(:disabled,:has(input:disabled,>button:disabled)).micl-button--toggle[aria-pressed=true]{--statelayer-color: var(--md-sys-color-on-primary);background-color:var(--md-comp-elevated-button-selected-container-color, var(--md-sys-color-primary));color:var(--md-comp-elevated-button-selected-label-text-color, var(--md-sys-color-on-primary))}.micl-chips .micl-chip--elevated:not(:disabled,:has(input:disabled,>button:disabled)).micl-button--toggle[aria-pressed=true] .micl-button__icon{font-variation-settings:"FILL" 1}.micl-chips .micl-chip-assist:not(.micl-chip--elevated),.micl-chips .micl-chip-filter:not(.micl-chip--elevated),.micl-chips .micl-chip-input:not(.micl-chip--elevated),.micl-chips .micl-chip-suggestion:not(.micl-chip--elevated){--statelayer-color: var(--md-sys-color-on-surface-variant);background-color:rgba(0,0,0,0);color:var(--md-comp-outlined-button-label-text-color, var(--md-sys-color-on-surface-variant));border:1px solid var(--md-comp-outlined-button-outline-color, var(--md-sys-color-outline-variant))}.micl-chips .micl-chip-assist:is(:disabled,:has(input:disabled,>button:disabled)):not(.micl-chip--elevated),.micl-chips .micl-chip-filter:is(:disabled,:has(input:disabled,>button:disabled)):not(.micl-chip--elevated),.micl-chips .micl-chip-input:is(:disabled,:has(input:disabled,>button:disabled)):not(.micl-chip--elevated),.micl-chips .micl-chip-suggestion:is(:disabled,:has(input:disabled,>button:disabled)):not(.micl-chip--elevated){background-color:rgba(0,0,0,0);color:var(--md-comp-outlined-button-disabled-label-text-color, rgb(from var(--md-sys-color-on-surface-variant) r g b/var(--md-comp-outlined-button-disabled-label-text-opacity, 38%)))}.micl-chips .micl-chip-assist:is(:disabled,:has(input:disabled,>button:disabled)).micl-button--toggle[aria-pressed=true]:not(.micl-chip--elevated),.micl-chips .micl-chip-filter:is(:disabled,:has(input:disabled,>button:disabled)).micl-button--toggle[aria-pressed=true]:not(.micl-chip--elevated),.micl-chips .micl-chip-input:is(:disabled,:has(input:disabled,>button:disabled)).micl-button--toggle[aria-pressed=true]:not(.micl-chip--elevated),.micl-chips .micl-chip-suggestion:is(:disabled,:has(input:disabled,>button:disabled)).micl-button--toggle[aria-pressed=true]:not(.micl-chip--elevated){border:none;background-color:var(--md-comp-outlined-button-selected-disabled-container-color, rgb(from var(--md-sys-color-on-surface) r g b/var(--md-comp-outlined-button-selected-disabled-container-opacity, 10%)))}.micl-chips .micl-chip-assist:not(:disabled,:has(input:disabled,>button:disabled)).micl-button--toggle[aria-pressed=true]:not(.micl-chip--elevated),.micl-chips .micl-chip-filter:not(:disabled,:has(input:disabled,>button:disabled)).micl-button--toggle[aria-pressed=true]:not(.micl-chip--elevated),.micl-chips .micl-chip-input:not(:disabled,:has(input:disabled,>button:disabled)).micl-button--toggle[aria-pressed=true]:not(.micl-chip--elevated),.micl-chips .micl-chip-suggestion:not(:disabled,:has(input:disabled,>button:disabled)).micl-button--toggle[aria-pressed=true]:not(.micl-chip--elevated){--statelayer-color: var(--md-sys-color-inverse-on-surface);border:none;background-color:var(--md-comp-outlined-button-selected-container-color, var(--md-sys-color-inverse-surface));color:var(--md-comp-outlined-button-selected-label-text-color, var(--md-sys-color-inverse-on-surface))}.micl-chips .micl-chip-assist:not(:disabled,:has(input:disabled,>button:disabled)).micl-button--toggle[aria-pressed=true]:not(.micl-chip--elevated) .micl-button__icon,.micl-chips .micl-chip-filter:not(:disabled,:has(input:disabled,>button:disabled)).micl-button--toggle[aria-pressed=true]:not(.micl-chip--elevated) .micl-button__icon,.micl-chips .micl-chip-input:not(:disabled,:has(input:disabled,>button:disabled)).micl-button--toggle[aria-pressed=true]:not(.micl-chip--elevated) .micl-button__icon,.micl-chips .micl-chip-suggestion:not(:disabled,:has(input:disabled,>button:disabled)).micl-button--toggle[aria-pressed=true]:not(.micl-chip--elevated) .micl-button__icon{font-variation-settings:"FILL" 1}:root{--md-sys-shape-corner-small: 8px}:root{--md-sys-shape-corner-full: 50%}:root{--md-sys-typescale-title-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-title-medium-size: 1rem;--md-sys-typescale-title-medium-line-height: 1.5rem;--md-sys-typescale-title-medium-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-title-medium-tracking: 0.0125rem}.micl-chips{display:flex;align-items:flex-start;flex-wrap:wrap;gap:8px;margin:0;padding:0;border:none}.micl-chips .micl-chips__headline{padding-block-end:4px;color:var(--md-sys-color-on-surface-variant)}.micl-chips .micl-chip-assist{--micl-chip-statelayer: var(--md-sys-color-on-surface);--micl-chip-label: var(--md-comp-assist-chip-label-text-color, var(--md-sys-color-on-surface));--micl-chip-icon: var(--md-comp-assist-chip-leading-icon-color);--micl-chip-outline: var(--md-comp-assist-chip-outline-color);--micl-chip-disabled-label: var(--md-comp-assist-chip-disabled-label-text-color);--micl-chip-disabled-outline: var(--md-comp-assist-chip-disabled-outline-color);--micl-chip-elevated-container: var(--md-comp-assist-chip-elevated-container-color)}.micl-chips .micl-chip-filter{--micl-chip-label: var(--md-comp-filter-chip-label-text-color);--micl-chip-icon: var(--md-comp-filter-chip-leading-icon-color);--micl-chip-outline: var(--md-comp-filter-chip-outline-color);--micl-chip-disabled-label: var(--md-comp-filter-chip-disabled-label-text-color);--micl-chip-disabled-outline: var(--md-comp-filter-chip-disabled-outline-color);--micl-chip-elevated-container: var(--md-comp-filter-chip-elevated-container-color)}.micl-chips .micl-chip-suggestion{--micl-chip-label: var(--md-comp-suggestion-chip-label-text-color);--micl-chip-icon: var(--md-comp-suggestion-chip-leading-icon-color);--micl-chip-outline: var(--md-comp-suggestion-chip-outline-color);--micl-chip-disabled-label: var(--md-comp-suggestion-chip-disabled-label-text-color);--micl-chip-disabled-outline: var(--md-comp-suggestion-chip-disabled-outline-color);--micl-chip-elevated-container: var(--md-comp-suggestion-chip-elevated-container-color)}.micl-chips .micl-chip-assist,.micl-chips .micl-chip-filter,.micl-chips .micl-chip-input,.micl-chips .micl-chip-suggestion{--md-comp-elevated-button-label-text-color: var(--micl-chip-label, var(--md-sys-color-on-surface-variant));--md-comp-outlined-button-label-text-color: var(--micl-chip-label, var(--md-sys-color-on-surface-variant));--md-comp-elevated-button-disabled-container-opacity: 12%;--md-comp-elevated-button-disabled-label-text-color: var(--micl-chip-disabled-label, rgb(from var(--md-sys-color-on-surface) r g b / 38%));--md-comp-outlined-button-disabled-label-text-color: var(--micl-chip-disabled-label, rgb(from var(--md-sys-color-on-surface) r g b / 38%));border-radius:var(--md-sys-shape-corner-small);padding-inline:16px;column-gap:8px}.micl-chips .micl-chip-assist:has(>.micl-button__icon:first-child),.micl-chips .micl-chip-filter:has(>.micl-button__icon:first-child),.micl-chips .micl-chip-input:has(>.micl-button__icon:first-child),.micl-chips .micl-chip-suggestion:has(>.micl-button__icon:first-child){padding-inline-start:8px}.micl-chips .micl-chip-assist:has(>.micl-button__icon:last-child),.micl-chips .micl-chip-filter:has(>.micl-button__icon:last-child),.micl-chips .micl-chip-input:has(>.micl-button__icon:last-child),.micl-chips .micl-chip-suggestion:has(>.micl-button__icon:last-child){padding-inline-end:8px}.micl-chips .micl-chip-assist .micl-button__icon,.micl-chips .micl-chip-filter .micl-button__icon,.micl-chips .micl-chip-input .micl-button__icon,.micl-chips .micl-chip-suggestion .micl-button__icon{font-size:18px;inline-size:18px;overflow:hidden;transition:inline-size 150ms cubic-bezier(0.31, 0.94, 0.34, 1)}.micl-chips .micl-chip-assist:not(:disabled,:has(input:disabled,>button:disabled)) .micl-button__icon,.micl-chips .micl-chip-filter:not(:disabled,:has(input:disabled,>button:disabled)) .micl-button__icon,.micl-chips .micl-chip-input:not(:disabled,:has(input:disabled,>button:disabled)) .micl-button__icon,.micl-chips .micl-chip-suggestion:not(:disabled,:has(input:disabled,>button:disabled)) .micl-button__icon{color:var(--micl-chip-icon, var(--md-sys-color-primary))}.micl-chips .micl-chip-assist:not(.micl-chip--elevated),.micl-chips .micl-chip-filter:not(.micl-chip--elevated),.micl-chips .micl-chip-input:not(.micl-chip--elevated),.micl-chips .micl-chip-suggestion:not(.micl-chip--elevated){--statelayer-color: var(--micl-chip-statelayer, var(--md-sys-color-on-surface-variant));--md-comp-outlined-button-outline-color: var(--micl-chip-outline, var(--md-sys-color-outline-variant))}.micl-chips .micl-chip-assist:not(.micl-chip--elevated):is(:disabled,:has(input:disabled,>button:disabled)),.micl-chips .micl-chip-filter:not(.micl-chip--elevated):is(:disabled,:has(input:disabled,>button:disabled)),.micl-chips .micl-chip-input:not(.micl-chip--elevated):is(:disabled,:has(input:disabled,>button:disabled)),.micl-chips .micl-chip-suggestion:not(.micl-chip--elevated):is(:disabled,:has(input:disabled,>button:disabled)){border-color:var(--micl-chip-disabled-outline, rgb(from var(--md-sys-color-on-surface) r g b/12%))}.micl-chips .micl-chip-input{--micl-chip-label: var(--md-comp-input-chip-label-text-color);--micl-chip-icon: var(--md-comp-input-chip-leading-icon-color, currentColor);--micl-chip-outline: var(--md-comp-input-chip-outline-color);--micl-chip-disabled-label: var(--md-comp-input-chip-disabled-label-text-color);--micl-chip-disabled-outline: var(--md-comp-input-chip-disabled-outline-color);padding-inline:0;column-gap:0;cursor:default}.micl-chips .micl-chip-input:has(>.micl-chip__primary:focus-visible){--statelayer-opacity: var(--md-sys-state-focus-state-layer-opacity, 10%);outline:var(--md-sys-state-focus-indicator-thickness, 3px) solid var(--md-sys-color-secondary);outline-offset:2px}.micl-chips .micl-chip-input:not(:disabled,:has(input:disabled,>button:disabled)):has(>.micl-chip__remove:is(:hover,:active)){--statelayer-opacity: 0%}.micl-chips .micl-chip-input:has(>:disabled) .micl-chip__avatar{opacity:var(--md-comp-input-chip-disabled-avatar-opacity, 38%)}.micl-chips .micl-chip-input:has(.micl-chip__avatar){border-radius:calc(var(--micl-height)/2)}.micl-chips .micl-chip-input:has(.micl-chip__avatar) .micl-chip__primary{border-start-start-radius:calc(var(--micl-height)/2 - 1px);border-end-start-radius:calc(var(--micl-height)/2 - 1px)}.micl-chips .micl-chip-input .micl-chip__primary,.micl-chips .micl-chip-input .micl-chip__remove{--statelayer-color: var(--micl-chip-statelayer, var(--md-sys-color-on-surface-variant));color:inherit;background-color:rgba(0,0,0,0)}.micl-chips .micl-chip-input .micl-chip__primary{background-image:radial-gradient(circle at var(--micl-x, center) var(--micl-y, center), transparent 0%, rgb(from var(--statelayer-color) r g b/calc(var(--statelayer-opacity) * var(--md-sys-state-ripple-opacity-factor))) 10%, transparent 10%);block-size:100%;column-gap:8px;padding-inline:12px 5px;border-start-start-radius:calc(var(--md-sys-shape-corner-small) - 1px);border-end-start-radius:calc(var(--md-sys-shape-corner-small) - 1px);border-start-end-radius:0;border-end-end-radius:0;font:inherit}.micl-chips .micl-chip-input .micl-chip__primary:has(>.micl-button__icon:first-child){padding-inline-start:8px}.micl-chips .micl-chip-input .micl-chip__primary:has(>.micl-chip__avatar:first-child){padding-inline-start:4px}.micl-chips .micl-chip-input .micl-chip__primary:not(:disabled,:has(input:disabled,>button:disabled)):is(:focus-visible,:has(input:focus-visible)){outline:none}.micl-chips .micl-chip-input .micl-chip__primary::before{content:"";position:absolute;inset-block-start:calc((100% - var(--md-sys-target-size, 48px))/2);inset-inline-start:0;block-size:var(--md-sys-target-size, 48px);inline-size:100%}.micl-chips .micl-chip-input .micl-chip__remove{inline-size:24px;block-size:24px;margin-inline:0 5px;border-radius:50%;font-size:18px}.micl-chips .micl-chip-input .micl-chip__remove:not(:disabled,:has(input:disabled,>button:disabled)){color:var(--md-comp-input-chip-trailing-icon-color, var(--md-comp-input-chip-leading-icon-color, currentColor))}.micl-chips .micl-chip-input .micl-chip__remove::before{content:"";position:absolute;inset-block-start:calc((100% - var(--md-sys-target-size, 48px))/2);inset-inline-start:calc((100% - var(--md-sys-target-size, 48px))/2);block-size:var(--md-sys-target-size, 48px);inline-size:var(--md-sys-target-size, 48px)}.micl-chips .micl-chip-input .micl-chip__avatar{font:var(--md-sys-typescale-title-medium-weight) var(--md-sys-typescale-title-medium-size)/var(--md-sys-typescale-title-medium-line-height) var(--md-sys-typescale-title-medium-font);letter-spacing:var(--md-sys-typescale-title-medium-tracking);display:flex;align-items:center;justify-content:center;block-size:var(--md-comp-input-chip-avatar-size, 24px);inline-size:var(--md-comp-input-chip-avatar-size, 24px);border-radius:var(--md-comp-input-chip-avatar-shape, var(--md-sys-shape-corner-full, 50%));color:var(--md-comp-input-chip-avatar-label-color, var(--md-sys-color-on-primary-container));background-color:var(--md-comp-input-chip-avatar-color, var(--md-sys-color-primary-container));object-fit:cover;object-position:center}.micl-chips .micl-chip-filter input{position:absolute;inset:0;margin:0;opacity:0;cursor:inherit}.micl-chips .micl-chip-filter .micl-button__icon+.micl-button__icon{margin-inline-start:-8px}.micl-chips .micl-chip-filter .micl-button__icon+.micl-button__icon:dir(rtl){margin-inline:0 -8px}.micl-chips .micl-chip-filter:has(input:not(:checked)) .micl-button__icon:has(+input){inline-size:0px}.micl-chips .micl-chip-filter:has(input:checked) .micl-button__icon:not(:has(+input)){inline-size:0px}.micl-chips .micl-chip-filter:has(input:checked){--micl-chip-statelayer: var(--md-sys-color-on-secondary-container);--micl-chip-label: var(--md-comp-filter-chip-selected-label-text-color, var(--md-sys-color-on-secondary-container));--micl-chip-icon: var(--md-comp-filter-chip-selected-leading-icon-color, var(--md-sys-color-on-secondary-container));--micl-chip-outline: var(--md-comp-filter-chip-selected-container-color, var(--md-sys-color-secondary-container));border-color:rgba(0,0,0,0);background-color:var(--md-comp-filter-chip-selected-container-color, var(--md-sys-color-secondary-container))}.micl-chips .micl-chip-filter:has(input:checked):not(.micl-chip--elevated):not(:disabled,:has(input:disabled,>button:disabled)):hover:not(:active){box-shadow:var(--md-sys-elevation-level1)}.micl-chips .micl-chip-filter:not(.micl-chip--elevated):has(input:disabled:checked){background-color:var(--md-comp-filter-chip-disabled-selected-container-color, rgb(from var(--md-sys-color-on-surface) r g b/var(--md-comp-filter-chip-disabled-selected-container-opacity, 12%)))}.micl-chips .micl-chip--elevated{--statelayer-color: var(--micl-chip-statelayer, var(--md-sys-color-on-surface-variant));--md-comp-elevated-button-container-color: var(--micl-chip-elevated-container, var(--md-sys-color-surface-container-low))}.micl-chips--input{min-inline-size:0;flex-wrap:nowrap;min-inline-size:0;padding:10px 16px 13px;border:1px solid var(--md-comp-outlined-button-outline-color, var(--md-sys-color-outline-variant));border-radius:var(--md-sys-shape-corner-small);overflow-x:auto;scrollbar-width:thin}.micl-chips .micl-chip__remove:dir(rtl){margin-inline:5px 0}
package/dist/datepicker.css CHANGED
@@ -1 +1 @@
1
- :root{--md-ref-typeface-plain: Google Sans, system-ui, sans-serif;--md-ref-typeface-plain-narrow: 0;--md-ref-typeface-brand: Google Sans, system-ui, sans-serif;--md-ref-typeface-weight-regular: 400;--md-ref-typeface-weight-medium: 500;--md-ref-typeface-weight-bold: 700}:root{--md-sys-shape-corner-large: 16px}:root{--md-sys-shape-corner-full: 50%}:root{--md-sys-state-hover-state-layer-opacity: 8%}:root{--md-sys-state-focus-state-layer-opacity: 10%}:root{--md-sys-state-pressed-state-layer-opacity: 10%}:root{--md-sys-state-disabled-state-layer-opacity: 38%}@property --statelayer-color{syntax:"<color>";initial-value:rgba(0,0,0,0);inherits:false}@property --statelayer-opacity{syntax:"<percentage>";initial-value:0%;inherits:false}:root{--md-sys-typescale-headline-large-font: var(--md-ref-typeface-brand);--md-sys-typescale-headline-large-size: 2rem;--md-sys-typescale-headline-large-line-height: 2.5rem;--md-sys-typescale-headline-large-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-headline-large-tracking: 0}:root{--md-sys-typescale-title-large-font: var(--md-ref-typeface-brand);--md-sys-typescale-title-large-size: 1.375rem;--md-sys-typescale-title-large-line-height: 1.75rem;--md-sys-typescale-title-large-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-title-large-tracking: 0}:root{--md-sys-typescale-body-large-font: var(--md-ref-typeface-plain);--md-sys-typescale-body-large-size: 1rem;--md-sys-typescale-body-large-line-height: 1.5rem;--md-sys-typescale-body-large-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-body-large-tracking: 0.03125rem}:root{--md-sys-typescale-label-large-font: var(--md-ref-typeface-plain);--md-sys-typescale-label-large-size: 0.875rem;--md-sys-typescale-label-large-line-height: 1.25rem;--md-sys-typescale-label-large-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-label-large-tracking: 0.00625rem}.micl-datepicker__months,.micl-datepicker__years,.micl-datepicker__input{block-size:fit-content;opacity:1;transition-duration:var(--md-comp-date-picker-motion-spatial-duration)}.micl-datepicker__view-hidden.micl-datepicker__months,.micl-datepicker__view-hidden.micl-datepicker__years,.micl-datepicker__view-hidden.micl-datepicker__input{block-size:0;opacity:0;transition-property:none}.micl-datepicker__months:not(.micl-datepicker__view-hidden),.micl-datepicker__years:not(.micl-datepicker__view-hidden),.micl-datepicker__input:not(.micl-datepicker__view-hidden){transition-behavior:allow-discrete;transition-property:opacity,display,block-size;transition-timing-function:linear}.micl-datepicker__years label,.micl-datepicker__calendar-inner time{--statelayer-color: var(--md-sys-color-on-surface-variant);--statelayer-opacity: 0%;background-image:linear-gradient(rgb(from var(--statelayer-color) r g b/var(--statelayer-opacity)));background-repeat:no-repeat;background-size:100%;background-clip:content-box;transition:--statelayer-opacity var(--md-comp-date-picker-button-motion-duration) linear}.micl-datepicker__years label:hover,.micl-datepicker__calendar-inner time:hover{--statelayer-opacity: var(--md-sys-state-hover-state-layer-opacity)}.micl-datepicker__years label:focus-visible,.micl-datepicker__calendar-inner time:focus-visible{--statelayer-opacity: var(--md-sys-state-focus-state-layer-opacity)}.micl-datepicker__years label:active,.micl-datepicker__calendar-inner time:active{--statelayer-opacity: var(--md-sys-state-pressed-state-layer-opacity)}dialog.micl-dialog.micl-datepicker{--md-comp-date-picker-motion-spatial: cubic-bezier(0.31, 0.94, 0.34, 1);--md-comp-date-picker-motion-spatial-duration: 500ms;--md-comp-date-picker-motion-duration: 200ms;--md-comp-date-picker-motion-duration-reverse: 150ms;--md-comp-date-picker-button-motion-duration: 350ms;--_target: var(--md-sys-target-size, 48px);inline-size:var(--md-comp-date-picker-modal-container-width, 360px)}dialog.micl-dialog.micl-datepicker:has(.micl-datepicker__input:not(.micl-datepicker__view-hidden)){inline-size:var(--md-comp-date-input-modal-container-width, 328px)}dialog.micl-dialog.micl-datepicker:has(.micl-datepicker__input:not(.micl-datepicker__view-hidden)) .micl-divider{margin-block:9.5px}dialog.micl-dialog.micl-datepicker:has(.micl-datepicker__input:not(.micl-datepicker__view-hidden)) .micl-dialog__content{min-block-size:85px}dialog.micl-dialog.micl-datepicker form{background-color:inherit}dialog.micl-dialog.micl-datepicker .micl-dialog__headline{display:grid;gap:0;grid-template-columns:max-content 1fr var(--_target);grid-template-areas:"sup sup sup" "close act act" "close head mode" "div div div" "ysel ysel msel";padding-inline-end:12px;padding-block:16px 4px}dialog.micl-dialog.micl-datepicker .micl-dialog__headline :is(h1,h2,h3,h4,h5,h6,.micl-heading){font-family:var(--md-sys-typescale-headline-large-font);font-size:var(--md-sys-typescale-headline-large-size);line-height:var(--md-sys-typescale-headline-large-line-height);font-weight:var(--md-sys-typescale-headline-large-weight);letter-spacing:var(--md-sys-typescale-headline-large-tracking);grid-area:head;margin-block-start:36px;color:var(--md-comp-date-picker-header-headline-color, var(--md-sys-color-on-surface-variant))}dialog.micl-dialog.micl-datepicker .micl-dialog__headline .micl-dialog__supporting-text{font-family:var(--md-sys-typescale-label-large-font);font-size:var(--md-sys-typescale-label-large-size);line-height:var(--md-sys-typescale-label-large-line-height);font-weight:var(--md-sys-typescale-label-large-weight);letter-spacing:var(--md-sys-typescale-label-large-tracking);grid-area:sup}dialog.micl-dialog.micl-datepicker .micl-dialog__headline .micl-divider{grid-area:div;inline-size:calc(100% + 36px);margin-block-start:11.5px;margin-inline:-24px}dialog.micl-dialog.micl-datepicker.micl-datepicker--range .micl-dialog__headline :is(h1,h2,h3,h4,h5,h6,.micl-heading){font-family:var(--md-sys-typescale-title-large-font);font-size:var(--md-sys-typescale-title-large-size);line-height:var(--md-sys-typescale-title-large-line-height);font-weight:var(--md-sys-typescale-title-large-weight);letter-spacing:var(--md-sys-typescale-title-large-tracking);margin-block-start:48px}dialog.micl-dialog.micl-datepicker .micl-dialog__content{display:grid;grid-template-areas:"view";position:relative;inline-size:100%;max-block-size:336px;min-block-size:330px;padding-inline:0;overflow:hidden auto;transition:min-block-size var(--md-comp-date-picker-motion-spatial-duration) var(--md-comp-date-picker-motion-spatial)}dialog.micl-dialog.micl-datepicker .micl-dialog__actions{padding:8px 12px 12px}dialog.micl-dialog.micl-datepicker.micl-dialog--docked{inline-size:var(--md-comp-date-picker-docked-container-width, 360px);border-radius:var(--md-sys-shape-corner-large)}dialog.micl-dialog.micl-datepicker.micl-dialog--docked .micl-dialog__headline{grid-template-areas:"msel ysel";grid-template-columns:1fr 1fr;padding:8px 12px 18px}dialog.micl-dialog.micl-datepicker.micl-dialog--docked .micl-dialog__headline :is(h1,h2,h3,h4,h5,h6,.micl-heading),dialog.micl-dialog.micl-datepicker.micl-dialog--docked .micl-dialog__headline .micl-dialog__supporting-text,dialog.micl-dialog.micl-datepicker.micl-dialog--docked .micl-dialog__headline .micl-datepicker__inputmode{display:none}dialog.micl-dialog.micl-datepicker.micl-dialog--docked .micl-dialog__actions>button{margin-block:-2px}.micl-datepicker__inputmode{grid-area:mode;align-self:flex-end;justify-self:center}.micl-datepicker__month-selector,.micl-datepicker__year-selector{display:grid;grid-template-rows:var(--_target);align-items:center}.micl-datepicker__month-selector.micl-datepicker__view-hidden,.micl-datepicker__year-selector.micl-datepicker__view-hidden{display:none}.micl-datepicker__month-selector{grid-area:msel;grid-template-areas:"mprev mnext";grid-template-columns:var(--_target) var(--_target);justify-items:flex-end;justify-content:flex-end}.micl-datepicker__month-selector .micl-datepicker__previous{grid-area:mprev}.micl-datepicker__month-selector .micl-datepicker__next{grid-area:mnext}.micl-datepicker__year-selector{grid-area:ysel;grid-template-areas:"yr";grid-template-columns:1fr;justify-items:flex-start;margin-inline-start:-8px}.micl-datepicker__year-selector .micl-datepicker__previous{display:none;grid-area:yprev}.micl-datepicker__year-selector .micl-datepicker__next{display:none;grid-area:ynext}.micl-datepicker__month{grid-area:mon;margin-inline:-12px auto}.micl-datepicker__month-selector .micl-datepicker__month{display:none}.micl-datepicker__year{grid-area:yr}.micl-datepicker__month:not(:disabled),.micl-datepicker__year:not(:disabled){color:var(--md-sys-color-on-surface-variant)}.micl-dialog--docked :is(.micl-datepicker__month-selector,.micl-datepicker__year-selector){grid-template-columns:var(--_target) 1fr var(--_target)}.micl-dialog--docked .micl-datepicker__month-selector{grid-template-areas:"mprev mon mnext"}.micl-dialog--docked .micl-datepicker__month-selector .micl-datepicker__month{display:inline-flex;margin-inline:0}.micl-dialog--docked .micl-datepicker__year-selector{grid-template-areas:"yprev yr ynext"}.micl-dialog--docked .micl-datepicker__year-selector :is(.micl-datepicker__previous,.micl-datepicker__next){display:block}.micl-datepicker__calendars{display:flex;grid-area:view;position:absolute;inset-block-start:0;inset-inline-start:0;block-size:100%;inline-size:200%;opacity:1;overflow:hidden;transform:translateX(0);transition:transform var(--md-comp-date-picker-motion-spatial-duration) var(--md-comp-date-picker-motion-spatial),opacity var(--md-comp-date-picker-motion-duration-reverse) linear,block-size var(--md-comp-date-picker-motion-duration-reverse) linear allow-discrete,display var(--md-comp-date-picker-motion-duration-reverse) linear allow-discrete}.micl-datepicker__calendars.micl-datepicker__view-hidden{block-size:0%;opacity:0;transition-property:none}.micl-datepicker__calendars.micl-startleft,.micl-datepicker__calendars.micl-moveright{transform:translateX(0%)}.micl-datepicker__calendars.micl-startright,.micl-datepicker__calendars.micl-moveleft{transform:translateX(-50%)}.micl-datepicker__calendar{flex-shrink:0;block-size:100%;inline-size:50%}.micl-datepicker__calendar-inner{font-family:var(--md-sys-typescale-body-large-font);font-size:var(--md-sys-typescale-body-large-size);line-height:var(--md-sys-typescale-body-large-line-height);font-weight:var(--md-sys-typescale-body-large-weight);letter-spacing:var(--md-sys-typescale-body-large-tracking);box-sizing:border-box;display:grid;grid-template-columns:repeat(7, var(--_target));grid-template-rows:40px repeat(6, var(--_target));block-size:100%;inline-size:100%;padding-inline:12px}.micl-datepicker__calendar-inner span,.micl-datepicker__calendar-inner time{box-sizing:border-box;display:inline-flex;justify-content:center;border:none;-webkit-tap-highlight-color:rgba(0,0,0,0)}.micl-datepicker__calendar-inner span{color:var(--md-comp-date-picker-weekdays-label-text-color, var(--md-sys-color-on-surface))}.micl-datepicker__calendar-inner time{align-items:center;border:4px solid rgba(0,0,0,0);border-radius:var(--md-sys-shape-corner-full);color:var(--md-comp-date-picker-date-unselected-label-text-color, var(--md-sys-color-on-surface))}.micl-datepicker__calendar-inner time.micl-datepicker__today{outline:1px solid var(--md-comp-date-picker-date-today-container-outline-color, var(--md-sys-color-primary));outline-offset:-5px;color:var(--md-comp-date-picker-date-today-label-text-color, var(--md-sys-color-primary))}.micl-datepicker__calendar-inner time.micl-datepicker__selected{background-color:var(--md-comp-date-picker-date-selected-container-color, var(--md-sys-color-primary));color:var(--md-comp-date-picker-date-selected-label-text-color, var(--md-sys-color-on-primary))}.micl-datepicker__calendar-inner time:is(.micl-datepicker__inrange,.micl-datepicker__range-start,.micl-datepicker__range-end){position:relative}.micl-datepicker__calendar-inner time:is(.micl-datepicker__inrange,.micl-datepicker__range-start,.micl-datepicker__range-end)::before{content:"";position:absolute;z-index:-1;inset-block:0;inset-inline:-4px;background-color:var(--md-comp-date-picker-range-selection-active-indicator-container-color, var(--md-sys-color-secondary-container))}.micl-datepicker__calendar-inner time.micl-datepicker__inrange{color:var(--md-comp-date-picker-selection-date-in-range-label-text-color, var(--md-sys-color-on-secondary-container))}.micl-datepicker__calendar-inner time.micl-datepicker__range-start::before{inset-inline:50% -4px}.micl-datepicker__calendar-inner time.micl-datepicker__range-end::before{inset-inline:-4px 50%}.micl-datepicker__calendar-inner time:is(.micl-datepicker__today,.micl-datepicker__selected):is(:hover,:focus-visible,:active){--statelayer-color: currentColor}.micl-datepicker__calendar-inner time.micl-datepicker__outside{color:rgb(from var(--md-sys-color-on-surface) r g b/var(--md-sys-state-disabled-state-layer-opacity))}.micl-datepicker__calendar-inner time:not(.micl-datepicker__outside){cursor:pointer}.micl-datepicker__months,.micl-datepicker__years,.micl-datepicker__input{grid-area:view}.micl-datepicker__months{overflow-y:hidden}.micl-datepicker__months .micl-datepicker__months-inner{block-size:auto;inline-size:100%}.micl-datepicker__months label{font-family:var(--md-sys-typescale-body-large-font);font-size:var(--md-sys-typescale-body-large-size);line-height:var(--md-sys-typescale-body-large-line-height);font-weight:var(--md-sys-typescale-body-large-weight);letter-spacing:var(--md-sys-typescale-body-large-tracking);display:flex;align-items:center;block-size:var(--_target);gap:8px;padding-inline-start:16px;color:var(--md-sys-color-on-surface);cursor:pointer}.micl-datepicker__months label span{visibility:hidden;color:var(--md-sys-color-on-surface)}.micl-datepicker__months label:has(input:checked){background-color:var(--md-sys-color-surface-variant)}.micl-datepicker__months label:has(input:checked) span{visibility:visible}.micl-datepicker__years{overflow-y:hidden}.micl-datepicker__years .micl-datepicker__years-inner{display:flex;flex-wrap:wrap;justify-content:center;block-size:auto;inline-size:100%}.micl-datepicker__years label{font-family:var(--md-sys-typescale-body-large-font);font-size:var(--md-sys-typescale-body-large-size);line-height:var(--md-sys-typescale-body-large-line-height);font-weight:var(--md-sys-typescale-body-large-weight);letter-spacing:var(--md-sys-typescale-body-large-tracking);display:inline-flex;align-items:center;justify-content:center;block-size:36px;inline-size:72px;margin:8px;border:calc((var(--_target) - 36px)/2) solid rgba(0,0,0,0);border-radius:calc(var(--_target)/2);color:var(--md-comp-date-picker-selection-year-unselected-label-text-color, var(--md-sys-color-on-surface-variant));cursor:pointer}.micl-datepicker__years label:has(input:checked){color:var(--md-comp-date-picker-selection-year-selected-label-text-color, var(--md-sys-color-on-primary));background-color:var(--md-comp-date-picker-selection-year-selected-container-color, var(--md-sys-color-primary))}.micl-datepicker__years label:has(input:checked):is(:hover,:focus-visible,:active){--statelayer-color: currentColor}:is(.micl-datepicker__months,.micl-datepicker__years) input[type=radio]{appearance:none;margin:0}.micl-datepicker .micl-datepicker__input{padding-inline:16px;margin-block-end:16px}.micl-datepicker .micl-datepicker__input.micl-datepicker__view-hidden,.micl-datepicker .micl-datepicker__input input[type=date]::-webkit-calendar-picker-indicator,.micl-datepicker .micl-datepicker__input input[type=date]::-webkit-inner-spin-button{display:none}.micl-datepicker--range .micl-datepicker__input{display:flex;column-gap:8px}.micl-datepicker--range .micl-datepicker__input>*{flex:1 1 0;min-inline-size:0}.micl-no-transition{transition:none !important}
1
+ :root{--md-ref-typeface-plain: Google Sans, system-ui, sans-serif;--md-ref-typeface-plain-narrow: 0;--md-ref-typeface-brand: Google Sans, system-ui, sans-serif;--md-ref-typeface-weight-regular: 400;--md-ref-typeface-weight-medium: 500;--md-ref-typeface-weight-bold: 700}:root{--md-sys-shape-corner-large: 16px}:root{--md-sys-shape-corner-full: 50%}:root{--md-sys-state-hover-state-layer-opacity: 8%}:root{--md-sys-state-focus-state-layer-opacity: 10%}:root{--md-sys-state-pressed-state-layer-opacity: 10%}:root{--md-sys-state-disabled-state-layer-opacity: 38%}@property --statelayer-color{syntax:"<color>";initial-value:rgba(0,0,0,0);inherits:false}@property --statelayer-opacity{syntax:"<percentage>";initial-value:0%;inherits:false}:root{--md-sys-typescale-headline-large-font: var(--md-ref-typeface-brand);--md-sys-typescale-headline-large-size: 2rem;--md-sys-typescale-headline-large-line-height: 2.5rem;--md-sys-typescale-headline-large-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-headline-large-tracking: 0}:root{--md-sys-typescale-title-large-font: var(--md-ref-typeface-brand);--md-sys-typescale-title-large-size: 1.375rem;--md-sys-typescale-title-large-line-height: 1.75rem;--md-sys-typescale-title-large-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-title-large-tracking: 0}:root{--md-sys-typescale-body-large-font: var(--md-ref-typeface-plain);--md-sys-typescale-body-large-size: 1rem;--md-sys-typescale-body-large-line-height: 1.5rem;--md-sys-typescale-body-large-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-body-large-tracking: 0.03125rem}:root{--md-sys-typescale-label-large-font: var(--md-ref-typeface-plain);--md-sys-typescale-label-large-size: 0.875rem;--md-sys-typescale-label-large-line-height: 1.25rem;--md-sys-typescale-label-large-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-label-large-tracking: 0.00625rem}.micl-datepicker__months,.micl-datepicker__years,.micl-datepicker__input{block-size:fit-content;opacity:1;transition-duration:var(--md-comp-date-picker-motion-spatial-duration)}.micl-datepicker__view-hidden.micl-datepicker__months,.micl-datepicker__view-hidden.micl-datepicker__years,.micl-datepicker__view-hidden.micl-datepicker__input{block-size:0;opacity:0;transition-property:none}.micl-datepicker__months:not(.micl-datepicker__view-hidden),.micl-datepicker__years:not(.micl-datepicker__view-hidden),.micl-datepicker__input:not(.micl-datepicker__view-hidden){transition-behavior:allow-discrete;transition-property:opacity,display,block-size;transition-timing-function:linear}.micl-datepicker__years label,.micl-datepicker__calendar-inner time{--statelayer-color: var(--md-sys-color-on-surface-variant);--statelayer-opacity: 0%;background-image:linear-gradient(rgb(from var(--statelayer-color) r g b/var(--statelayer-opacity)));background-repeat:no-repeat;background-size:100%;background-clip:content-box;transition:--statelayer-opacity var(--md-comp-date-picker-button-motion-duration) linear}.micl-datepicker__years label:hover,.micl-datepicker__calendar-inner time:hover{--statelayer-opacity: var(--md-sys-state-hover-state-layer-opacity)}.micl-datepicker__years label:focus-visible,.micl-datepicker__calendar-inner time:focus-visible{--statelayer-opacity: var(--md-sys-state-focus-state-layer-opacity)}.micl-datepicker__years label:active,.micl-datepicker__calendar-inner time:active{--statelayer-opacity: var(--md-sys-state-pressed-state-layer-opacity)}dialog.micl-dialog.micl-datepicker{--md-comp-date-picker-motion-spatial: cubic-bezier(0.31, 0.94, 0.34, 1);--md-comp-date-picker-motion-spatial-duration: 500ms;--md-comp-date-picker-motion-duration: 200ms;--md-comp-date-picker-motion-duration-reverse: 150ms;--md-comp-date-picker-button-motion-duration: 350ms;--_target: var(--md-sys-target-size, 48px);inline-size:var(--md-comp-date-picker-modal-container-width, 360px)}dialog.micl-dialog.micl-datepicker:has(.micl-datepicker__input:not(.micl-datepicker__view-hidden)){inline-size:var(--md-comp-date-input-modal-container-width, 328px)}dialog.micl-dialog.micl-datepicker:has(.micl-datepicker__input:not(.micl-datepicker__view-hidden)) .micl-divider{margin-block:9.5px}dialog.micl-dialog.micl-datepicker:has(.micl-datepicker__input:not(.micl-datepicker__view-hidden)) .micl-dialog__content{min-block-size:85px}dialog.micl-dialog.micl-datepicker form{background-color:inherit}dialog.micl-dialog.micl-datepicker .micl-dialog__headline{display:grid;gap:0;grid-template-columns:max-content 1fr var(--_target);grid-template-areas:"sup sup sup" "close act act" "close head mode" "div div div" "ysel ysel msel";padding-inline-end:12px;padding-block:16px 4px}dialog.micl-dialog.micl-datepicker .micl-dialog__headline :is(h1,h2,h3,h4,h5,h6,.micl-heading){font:var(--md-sys-typescale-headline-large-weight) var(--md-sys-typescale-headline-large-size)/var(--md-sys-typescale-headline-large-line-height) var(--md-sys-typescale-headline-large-font);letter-spacing:var(--md-sys-typescale-headline-large-tracking);grid-area:head;margin-block-start:36px;color:var(--md-comp-date-picker-header-headline-color, var(--md-sys-color-on-surface-variant))}dialog.micl-dialog.micl-datepicker .micl-dialog__headline .micl-dialog__supporting-text{font:var(--md-sys-typescale-label-large-weight) var(--md-sys-typescale-label-large-size)/var(--md-sys-typescale-label-large-line-height) var(--md-sys-typescale-label-large-font);letter-spacing:var(--md-sys-typescale-label-large-tracking);grid-area:sup}dialog.micl-dialog.micl-datepicker .micl-dialog__headline .micl-divider{grid-area:div;inline-size:calc(100% + 36px);margin-block-start:11.5px;margin-inline:-24px}dialog.micl-dialog.micl-datepicker.micl-datepicker--range .micl-dialog__headline :is(h1,h2,h3,h4,h5,h6,.micl-heading){font:var(--md-sys-typescale-title-large-weight) var(--md-sys-typescale-title-large-size)/var(--md-sys-typescale-title-large-line-height) var(--md-sys-typescale-title-large-font);letter-spacing:var(--md-sys-typescale-title-large-tracking);margin-block-start:48px}dialog.micl-dialog.micl-datepicker .micl-dialog__content{display:grid;grid-template-areas:"view";position:relative;inline-size:100%;max-block-size:336px;min-block-size:330px;padding-inline:0;overflow:hidden auto;transition:min-block-size var(--md-comp-date-picker-motion-spatial-duration) var(--md-comp-date-picker-motion-spatial)}dialog.micl-dialog.micl-datepicker .micl-dialog__actions{padding:8px 12px 12px}dialog.micl-dialog.micl-datepicker.micl-dialog--docked{inline-size:var(--md-comp-date-picker-docked-container-width, 360px);border-radius:var(--md-sys-shape-corner-large)}dialog.micl-dialog.micl-datepicker.micl-dialog--docked .micl-dialog__headline{grid-template-areas:"msel ysel";grid-template-columns:1fr 1fr;padding:8px 12px 18px}dialog.micl-dialog.micl-datepicker.micl-dialog--docked .micl-dialog__headline :is(h1,h2,h3,h4,h5,h6,.micl-heading),dialog.micl-dialog.micl-datepicker.micl-dialog--docked .micl-dialog__headline .micl-dialog__supporting-text,dialog.micl-dialog.micl-datepicker.micl-dialog--docked .micl-dialog__headline .micl-datepicker__inputmode{display:none}dialog.micl-dialog.micl-datepicker.micl-dialog--docked .micl-dialog__actions>button{margin-block:-2px}.micl-datepicker__inputmode{grid-area:mode;align-self:flex-end;justify-self:center}.micl-datepicker__month-selector,.micl-datepicker__year-selector{display:grid;grid-template-rows:var(--_target);align-items:center}.micl-datepicker__month-selector.micl-datepicker__view-hidden,.micl-datepicker__year-selector.micl-datepicker__view-hidden{display:none}.micl-datepicker__month-selector{grid-area:msel;grid-template-areas:"mprev mnext";grid-template-columns:var(--_target) var(--_target);justify-items:flex-end;justify-content:flex-end}.micl-datepicker__month-selector .micl-datepicker__previous{grid-area:mprev}.micl-datepicker__month-selector .micl-datepicker__next{grid-area:mnext}.micl-datepicker__year-selector{grid-area:ysel;grid-template-areas:"yr";grid-template-columns:1fr;justify-items:flex-start;margin-inline-start:-8px}.micl-datepicker__year-selector .micl-datepicker__previous{display:none;grid-area:yprev}.micl-datepicker__year-selector .micl-datepicker__next{display:none;grid-area:ynext}.micl-datepicker__month{grid-area:mon;margin-inline:-12px auto}.micl-datepicker__month-selector .micl-datepicker__month{display:none}.micl-datepicker__year{grid-area:yr}.micl-datepicker__month:not(:disabled),.micl-datepicker__year:not(:disabled){color:var(--md-sys-color-on-surface-variant)}.micl-dialog--docked :is(.micl-datepicker__month-selector,.micl-datepicker__year-selector){grid-template-columns:var(--_target) 1fr var(--_target)}.micl-dialog--docked .micl-datepicker__month-selector{grid-template-areas:"mprev mon mnext"}.micl-dialog--docked .micl-datepicker__month-selector .micl-datepicker__month{display:inline-flex;margin-inline:0}.micl-dialog--docked .micl-datepicker__year-selector{grid-template-areas:"yprev yr ynext"}.micl-dialog--docked .micl-datepicker__year-selector :is(.micl-datepicker__previous,.micl-datepicker__next){display:block}.micl-datepicker__calendars{display:flex;grid-area:view;position:absolute;inset-block-start:0;inset-inline-start:0;block-size:100%;inline-size:200%;opacity:1;overflow:hidden;transform:translateX(0);transition:transform var(--md-comp-date-picker-motion-spatial-duration) var(--md-comp-date-picker-motion-spatial),opacity var(--md-comp-date-picker-motion-duration-reverse) linear,block-size var(--md-comp-date-picker-motion-duration-reverse) linear allow-discrete,display var(--md-comp-date-picker-motion-duration-reverse) linear allow-discrete}.micl-datepicker__calendars.micl-datepicker__view-hidden{block-size:0%;opacity:0;transition-property:none}.micl-datepicker__calendars.micl-startleft,.micl-datepicker__calendars.micl-moveright{transform:translateX(0%)}.micl-datepicker__calendars.micl-startright,.micl-datepicker__calendars.micl-moveleft{transform:translateX(-50%)}.micl-datepicker__calendar{flex-shrink:0;block-size:100%;inline-size:50%}.micl-datepicker__calendar-inner{font:var(--md-sys-typescale-body-large-weight) var(--md-sys-typescale-body-large-size)/var(--md-sys-typescale-body-large-line-height) var(--md-sys-typescale-body-large-font);letter-spacing:var(--md-sys-typescale-body-large-tracking);box-sizing:border-box;display:grid;grid-template-columns:repeat(7, var(--_target));grid-template-rows:40px repeat(6, var(--_target));block-size:100%;inline-size:100%;padding-inline:12px}.micl-datepicker__calendar-inner span,.micl-datepicker__calendar-inner time{box-sizing:border-box;display:inline-flex;justify-content:center;border:none;-webkit-tap-highlight-color:rgba(0,0,0,0)}.micl-datepicker__calendar-inner span{color:var(--md-comp-date-picker-weekdays-label-text-color, var(--md-sys-color-on-surface))}.micl-datepicker__calendar-inner time{align-items:center;border:4px solid rgba(0,0,0,0);border-radius:var(--md-sys-shape-corner-full);color:var(--md-comp-date-picker-date-unselected-label-text-color, var(--md-sys-color-on-surface))}.micl-datepicker__calendar-inner time.micl-datepicker__today{outline:1px solid var(--md-comp-date-picker-date-today-container-outline-color, var(--md-sys-color-primary));outline-offset:-5px;color:var(--md-comp-date-picker-date-today-label-text-color, var(--md-sys-color-primary))}.micl-datepicker__calendar-inner time.micl-datepicker__selected{background-color:var(--md-comp-date-picker-date-selected-container-color, var(--md-sys-color-primary));color:var(--md-comp-date-picker-date-selected-label-text-color, var(--md-sys-color-on-primary))}.micl-datepicker__calendar-inner time:is(.micl-datepicker__inrange,.micl-datepicker__range-start,.micl-datepicker__range-end){position:relative}.micl-datepicker__calendar-inner time:is(.micl-datepicker__inrange,.micl-datepicker__range-start,.micl-datepicker__range-end)::before{content:"";position:absolute;z-index:-1;inset-block:0;inset-inline:-4px;background-color:var(--md-comp-date-picker-range-selection-active-indicator-container-color, var(--md-sys-color-secondary-container))}.micl-datepicker__calendar-inner time.micl-datepicker__inrange{color:var(--md-comp-date-picker-selection-date-in-range-label-text-color, var(--md-sys-color-on-secondary-container))}.micl-datepicker__calendar-inner time.micl-datepicker__range-start::before{inset-inline:50% -4px}.micl-datepicker__calendar-inner time.micl-datepicker__range-end::before{inset-inline:-4px 50%}.micl-datepicker__calendar-inner time:is(.micl-datepicker__today,.micl-datepicker__selected):is(:hover,:focus-visible,:active){--statelayer-color: currentColor}.micl-datepicker__calendar-inner time.micl-datepicker__outside{color:rgb(from var(--md-sys-color-on-surface) r g b/var(--md-sys-state-disabled-state-layer-opacity))}.micl-datepicker__calendar-inner time:not(.micl-datepicker__outside){cursor:pointer}.micl-datepicker__months,.micl-datepicker__years,.micl-datepicker__input{grid-area:view}.micl-datepicker__months{overflow-y:hidden}.micl-datepicker__months .micl-datepicker__months-inner{block-size:auto;inline-size:100%}.micl-datepicker__months label{font:var(--md-sys-typescale-body-large-weight) var(--md-sys-typescale-body-large-size)/var(--md-sys-typescale-body-large-line-height) var(--md-sys-typescale-body-large-font);letter-spacing:var(--md-sys-typescale-body-large-tracking);display:flex;align-items:center;block-size:var(--_target);gap:8px;padding-inline-start:16px;color:var(--md-sys-color-on-surface);cursor:pointer}.micl-datepicker__months label span{visibility:hidden;color:var(--md-sys-color-on-surface)}.micl-datepicker__months label:has(input:checked){background-color:var(--md-sys-color-surface-variant)}.micl-datepicker__months label:has(input:checked) span{visibility:visible}.micl-datepicker__years{overflow-y:hidden}.micl-datepicker__years .micl-datepicker__years-inner{display:flex;flex-wrap:wrap;justify-content:center;block-size:auto;inline-size:100%}.micl-datepicker__years label{font:var(--md-sys-typescale-body-large-weight) var(--md-sys-typescale-body-large-size)/var(--md-sys-typescale-body-large-line-height) var(--md-sys-typescale-body-large-font);letter-spacing:var(--md-sys-typescale-body-large-tracking);display:inline-flex;align-items:center;justify-content:center;block-size:36px;inline-size:72px;margin:8px;border:calc((var(--_target) - 36px)/2) solid rgba(0,0,0,0);border-radius:calc(var(--_target)/2);color:var(--md-comp-date-picker-selection-year-unselected-label-text-color, var(--md-sys-color-on-surface-variant));cursor:pointer}.micl-datepicker__years label:has(input:checked){color:var(--md-comp-date-picker-selection-year-selected-label-text-color, var(--md-sys-color-on-primary));background-color:var(--md-comp-date-picker-selection-year-selected-container-color, var(--md-sys-color-primary))}.micl-datepicker__years label:has(input:checked):is(:hover,:focus-visible,:active){--statelayer-color: currentColor}:is(.micl-datepicker__months,.micl-datepicker__years) input[type=radio]{appearance:none;margin:0}.micl-datepicker .micl-datepicker__input{padding-inline:16px;margin-block-end:16px}.micl-datepicker .micl-datepicker__input.micl-datepicker__view-hidden,.micl-datepicker .micl-datepicker__input input[type=date]::-webkit-calendar-picker-indicator,.micl-datepicker .micl-datepicker__input input[type=date]::-webkit-inner-spin-button{display:none}.micl-datepicker--range .micl-datepicker__input{display:flex;column-gap:8px}.micl-datepicker--range .micl-datepicker__input>*{flex:1 1 0;min-inline-size:0}.micl-no-transition{transition:none !important}
package/dist/dialog.css CHANGED
@@ -1 +1 @@
1
- :root{--md-ref-typeface-plain: Google Sans, system-ui, sans-serif;--md-ref-typeface-plain-narrow: 0;--md-ref-typeface-brand: Google Sans, system-ui, sans-serif;--md-ref-typeface-weight-regular: 400;--md-ref-typeface-weight-medium: 500;--md-ref-typeface-weight-bold: 700}body{--md-sys-elevation-level0: none}body{--md-sys-elevation-level2: rgb(from var(--md-sys-color-shadow) r g b/0.3) 0 1px 2px 0, rgb(from var(--md-sys-color-shadow) r g b/0.15) 0 2px 6px 2px}body{--md-sys-elevation-level3: rgb(from var(--md-sys-color-shadow) r g b/0.3) 0 1px 3px 0, rgb(from var(--md-sys-color-shadow) r g b/0.15) 0 4px 8px 3px}:root{--md-sys-shape-corner-none: 0px}:root{--md-sys-shape-corner-extra-large: 28px}:root{--md-sys-state-hover-state-layer-opacity: 8%}:root{--md-sys-state-backdrop-opacity: 32%}@property --statelayer-color{syntax:"<color>";initial-value:rgba(0,0,0,0);inherits:false}@property --statelayer-opacity{syntax:"<percentage>";initial-value:0%;inherits:false}:root{--md-sys-typescale-headline-small-font: var(--md-ref-typeface-brand);--md-sys-typescale-headline-small-size: 1.5rem;--md-sys-typescale-headline-small-line-height: 2rem;--md-sys-typescale-headline-small-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-headline-small-tracking: 0}:root{--md-sys-typescale-title-large-font: var(--md-ref-typeface-brand);--md-sys-typescale-title-large-size: 1.375rem;--md-sys-typescale-title-large-line-height: 1.75rem;--md-sys-typescale-title-large-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-title-large-tracking: 0}:root{--md-sys-typescale-title-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-title-medium-size: 1rem;--md-sys-typescale-title-medium-line-height: 1.5rem;--md-sys-typescale-title-medium-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-title-medium-tracking: 0.0125rem}:root{--md-sys-typescale-body-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-body-medium-size: 0.875rem;--md-sys-typescale-body-medium-line-height: 1.25rem;--md-sys-typescale-body-medium-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-body-medium-tracking: 0.0125rem}:root{--_dialog-dir-factor: 1}:dir(rtl){--_dialog-dir-factor: -1}dialog.micl-dialog{--statelayer-color: var(--md-sys-color-primary);--md-comp-dialog-motion-duration: 350ms;--md-comp-dialog-motion-duration-reverse: 350ms;--micl-duration: var(--md-comp-dialog-motion-duration-reverse);--micl-easing: cubic-bezier(0.05, 0.7, 0.1, 1);--_dialog-background-color: var(--md-comp-dialog-container-color, var(--md-sys-color-surface-container-high));--_padding: var(--md-comp-dialog-padding, 24px);--_translate: translate(calc(var(--_dialog-dir-factor, 1) * -50%), -50%);box-sizing:border-box;display:none;flex-direction:column;min-inline-size:var(--md-comp-dialog-min-width, 280px);max-inline-size:var(--md-comp-dialog-max-width, 560px);max-block-size:100vh;inset-block-start:anchor(start);inset-inline-start:anchor(start);transform:var(--_translate) scale(50%);padding:0;margin:0;outline:none;border:none;border-radius:var(--md-comp-dialog-container-shape, var(--md-sys-shape-corner-extra-large));background-color:var(--_dialog-background-color);background-image:linear-gradient(rgb(from var(--statelayer-color) r g b/var(--statelayer-opacity)));background-repeat:no-repeat;box-shadow:var(--md-comp-dialog-container-elevation, var(--md-sys-elevation-level3));opacity:0;overflow:hidden;interpolate-size:allow-keywords;transition:inset-block-start var(--micl-duration) linear,inset-inline-start var(--micl-duration) linear,inline-size var(--micl-duration) linear,block-size var(--micl-duration) linear,transform var(--micl-duration) linear,opacity var(--micl-duration) var(--micl-easing),overlay var(--micl-duration) linear allow-discrete,display var(--micl-duration) linear allow-discrete,--statelayer-opacity var(--md-comp-dialog-motion-duration) linear}@starting-style{dialog.micl-dialog{block-size:fit-content;inline-size:fit-content;inset-block-start:anchor(start);inset-inline-start:anchor(start);opacity:0;transform:var(--_translate) scale(50%)}}dialog.micl-dialog:popover-open,dialog.micl-dialog[open]{--micl-duration: var(--md-comp-dialog-motion-duration);--micl-easing: cubic-bezier(0.3, 0, 0.8, 0.15);display:flex;inset-block-start:50%;inset-inline-start:50%;opacity:1;transform:var(--_translate) scale(100%)}@starting-style{dialog.micl-dialog:popover-open,dialog.micl-dialog[open]{inset-block-start:anchor(start);inset-inline-start:anchor(start);opacity:0;transform:var(--_translate) scale(50%)}}dialog.micl-dialog:not([popover]){inset-block-start:50%;inset-inline-start:50%}@starting-style{dialog.micl-dialog:not([popover]){inset-block-start:50%;inset-inline-start:50%}}@starting-style{dialog.micl-dialog:not([popover]):popover-open,dialog.micl-dialog:not([popover])[open]{inset-block-start:50%;inset-inline-start:50%}}dialog.micl-dialog::backdrop{background-color:rgba(0,0,0,0);transition:background-color var(--md-comp-dialog-motion-duration) linear,overlay var(--md-comp-dialog-motion-duration) linear allow-discrete,display var(--md-comp-dialog-motion-duration) linear allow-discrete}dialog.micl-dialog[open]::backdrop{background-color:rgba(0, 0, 0, var(--md-sys-state-backdrop-opacity, 32%))}@starting-style{dialog.micl-dialog[open]::backdrop{background-color:rgba(0,0,0,0)}}dialog.micl-dialog.micl-dialog--docked{position-anchor:auto;inset-block:anchor(end) auto;inset-inline:anchor(start) auto;transform:none;transition:none;position-try-fallbacks:flip-block}dialog.micl-dialog .micl-dialog__headline{display:flex;flex-direction:column;flex-shrink:0;align-items:flex-start;gap:16px;padding-block:var(--_padding) var(--md-comp-dialog-headline-space, 16px);padding-inline:var(--_padding);background-color:rgba(0,0,0,0)}dialog.micl-dialog .micl-dialog__headline:has(>.micl-dialog__icon){align-items:center}dialog.micl-dialog .micl-dialog__headline .micl-dialog__icon{--_icon-size: var(--md-comp-dialog-icon-size, var(--md-sys-icon-size, 24px));inline-size:var(--_icon-size);block-size:var(--_icon-size);font-size:var(--_icon-size);color:var(--md-comp-dialog-icon-color, var(--md-sys-color-secondary))}dialog.micl-dialog .micl-dialog__headline :is(h1,h2,h3,h4,h5,h6,.micl-heading){font-family:var(--md-sys-typescale-headline-small-font);font-size:var(--md-sys-typescale-headline-small-size);line-height:var(--md-sys-typescale-headline-small-line-height);font-weight:var(--md-sys-typescale-headline-small-weight);letter-spacing:var(--md-sys-typescale-headline-small-tracking);flex:1 1 100%;margin:0;color:var(--md-comp-dialog-headline-color, var(--md-sys-color-on-surface))}dialog.micl-dialog .micl-dialog__headline .micl-dialog__subhead{font-family:var(--md-sys-typescale-title-medium-font);font-size:var(--md-sys-typescale-title-medium-size);line-height:var(--md-sys-typescale-title-medium-line-height);font-weight:var(--md-sys-typescale-title-medium-weight);letter-spacing:var(--md-sys-typescale-title-medium-tracking);padding-inline:var(--_padding);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--md-sys-color-on-surface)}dialog.micl-dialog .micl-dialog__headline:has(+.micl-dialog__actions){padding-block-end:0}dialog.micl-dialog .micl-dialog__supporting-text{font-family:var(--md-sys-typescale-body-medium-font);font-size:var(--md-sys-typescale-body-medium-size);line-height:var(--md-sys-typescale-body-medium-line-height);font-weight:var(--md-sys-typescale-body-medium-weight);letter-spacing:var(--md-sys-typescale-body-medium-tracking);color:var(--md-comp-dialog-supporting-text-color, var(--md-sys-color-on-surface-variant))}dialog.micl-dialog .micl-dialog__content{flex-shrink:1;padding-inline:var(--_padding);overflow-y:auto}dialog.micl-dialog .micl-dialog__actions{display:flex;flex-shrink:0;justify-content:flex-end;column-gap:8px;padding:var(--_padding);opacity:1;transition:opacity var(--md-comp-dialog-motion-duration) linear allow-discrete,overlay var(--md-comp-dialog-motion-duration) linear allow-discrete,display var(--md-comp-dialog-motion-duration) linear allow-discrete}@media(max-width: 560px){dialog.micl-dialog.micl-dialog--fullscreen{--_dialog-background-color: var(--md-comp-full-screen-dialog-container-color, var(--md-sys-color-surface));inline-size:100vw;block-size:100vh;max-inline-size:100vw;border-radius:var(--md-sys-shape-corner-none, 0px);box-shadow:var(--md-sys-elevation-level0);timeline-scope:--headlineTimeline}dialog.micl-dialog.micl-dialog--fullscreen .micl-dialog__headline{box-sizing:border-box;block-size:56px;flex-direction:row;align-items:center;gap:8px;padding-block:4px;padding-inline:8px 16px;animation-name:headlineScroll;animation-duration:1ms;animation-timeline:--headlineTimeline;animation-fill-mode:forwards;animation-range:0% 20%;z-index:1}dialog.micl-dialog.micl-dialog--fullscreen .micl-dialog__headline :is(h1,h2,h3,h4,h5,h6,.micl-heading){font-family:var(--md-sys-typescale-title-large-font);font-size:var(--md-sys-typescale-title-large-size);line-height:var(--md-sys-typescale-title-large-line-height);font-weight:var(--md-sys-typescale-title-large-weight);letter-spacing:var(--md-sys-typescale-title-large-tracking);margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}dialog.micl-dialog.micl-dialog--fullscreen .micl-dialog__headline .micl-dialog__icon{display:none}dialog.micl-dialog.micl-dialog--fullscreen .micl-dialog__content{scroll-timeline:--headlineTimeline block;scroll-timeline:--headlineTimeline vertical}dialog.micl-dialog.micl-dialog--fullscreen .micl-dialog__actions{display:none;opacity:0}}@media(min-width: 561px){dialog.micl-dialog.micl-dialog--fullscreen .micl-dialog__fullscreen{display:none}}@media(max-width: 560px){body:has(dialog.micl-dialog.micl-dialog--fullscreen:popover-open){overflow-y:hidden}}@keyframes headlineScroll{from{background-color:rgba(0,0,0,0);box-shadow:var(--md-sys-elevation-level0)}to{background-color:var(--md-sys-color-surface-container);box-shadow:var(--md-sys-elevation-level2)}}
1
+ :root{--md-ref-typeface-plain: Google Sans, system-ui, sans-serif;--md-ref-typeface-plain-narrow: 0;--md-ref-typeface-brand: Google Sans, system-ui, sans-serif;--md-ref-typeface-weight-regular: 400;--md-ref-typeface-weight-medium: 500;--md-ref-typeface-weight-bold: 700}body{--md-sys-elevation-level0: none}body{--md-sys-elevation-level2: rgb(from var(--md-sys-color-shadow) r g b/0.3) 0 1px 2px 0, rgb(from var(--md-sys-color-shadow) r g b/0.15) 0 2px 6px 2px}body{--md-sys-elevation-level3: rgb(from var(--md-sys-color-shadow) r g b/0.3) 0 1px 3px 0, rgb(from var(--md-sys-color-shadow) r g b/0.15) 0 4px 8px 3px}:root{--md-sys-shape-corner-none: 0px}:root{--md-sys-shape-corner-extra-large: 28px}:root{--md-sys-state-hover-state-layer-opacity: 8%}:root{--md-sys-state-backdrop-opacity: 32%}@property --statelayer-color{syntax:"<color>";initial-value:rgba(0,0,0,0);inherits:false}@property --statelayer-opacity{syntax:"<percentage>";initial-value:0%;inherits:false}:root{--md-sys-typescale-headline-small-font: var(--md-ref-typeface-brand);--md-sys-typescale-headline-small-size: 1.5rem;--md-sys-typescale-headline-small-line-height: 2rem;--md-sys-typescale-headline-small-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-headline-small-tracking: 0}:root{--md-sys-typescale-title-large-font: var(--md-ref-typeface-brand);--md-sys-typescale-title-large-size: 1.375rem;--md-sys-typescale-title-large-line-height: 1.75rem;--md-sys-typescale-title-large-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-title-large-tracking: 0}:root{--md-sys-typescale-title-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-title-medium-size: 1rem;--md-sys-typescale-title-medium-line-height: 1.5rem;--md-sys-typescale-title-medium-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-title-medium-tracking: 0.0125rem}:root{--md-sys-typescale-body-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-body-medium-size: 0.875rem;--md-sys-typescale-body-medium-line-height: 1.25rem;--md-sys-typescale-body-medium-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-body-medium-tracking: 0.0125rem}:root{--_dialog-dir-factor: 1}:dir(rtl){--_dialog-dir-factor: -1}dialog.micl-dialog{--statelayer-color: var(--md-sys-color-primary);--md-comp-dialog-motion-duration: 350ms;--md-comp-dialog-motion-duration-reverse: 350ms;--micl-duration: var(--md-comp-dialog-motion-duration-reverse);--micl-easing: cubic-bezier(0.05, 0.7, 0.1, 1);--_dialog-background-color: var(--md-comp-dialog-container-color, var(--md-sys-color-surface-container-high));--_padding: var(--md-comp-dialog-padding, 24px);--_translate: translate(calc(var(--_dialog-dir-factor, 1) * -50%), -50%);box-sizing:border-box;display:none;flex-direction:column;min-inline-size:var(--md-comp-dialog-min-width, 280px);max-inline-size:var(--md-comp-dialog-max-width, 560px);max-block-size:100vh;position-anchor:auto;inset-block-start:anchor(start);inset-inline-start:anchor(start);transform:var(--_translate) scale(50%);padding:0;margin:0;outline:none;border:none;border-radius:var(--md-comp-dialog-container-shape, var(--md-sys-shape-corner-extra-large));background-color:var(--_dialog-background-color);background-image:linear-gradient(rgb(from var(--statelayer-color) r g b/var(--statelayer-opacity)));background-repeat:no-repeat;box-shadow:var(--md-comp-dialog-container-elevation, var(--md-sys-elevation-level3));opacity:0;overflow:hidden;interpolate-size:allow-keywords;transition:inset-block-start var(--micl-duration) linear,inset-inline-start var(--micl-duration) linear,inline-size var(--micl-duration) linear,block-size var(--micl-duration) linear,transform var(--micl-duration) linear,opacity var(--micl-duration) var(--micl-easing),overlay var(--micl-duration) linear allow-discrete,display var(--micl-duration) linear allow-discrete,--statelayer-opacity var(--md-comp-dialog-motion-duration) linear}@starting-style{dialog.micl-dialog{block-size:fit-content;inline-size:fit-content;inset-block-start:anchor(start);inset-inline-start:anchor(start);opacity:0;transform:var(--_translate) scale(50%)}}dialog.micl-dialog:popover-open,dialog.micl-dialog[open]{--micl-duration: var(--md-comp-dialog-motion-duration);--micl-easing: cubic-bezier(0.3, 0, 0.8, 0.15);display:flex;inset-block-start:50%;inset-inline-start:50%;opacity:1;transform:var(--_translate) scale(100%)}@starting-style{dialog.micl-dialog:popover-open,dialog.micl-dialog[open]{inset-block-start:anchor(start);inset-inline-start:anchor(start);opacity:0;transform:var(--_translate) scale(50%)}}dialog.micl-dialog:not([popover]){inset-block-start:50%;inset-inline-start:50%}@starting-style{dialog.micl-dialog:not([popover]){inset-block-start:50%;inset-inline-start:50%}}@starting-style{dialog.micl-dialog:not([popover]):popover-open,dialog.micl-dialog:not([popover])[open]{inset-block-start:50%;inset-inline-start:50%}}dialog.micl-dialog::backdrop{background-color:rgba(0,0,0,0);transition:background-color var(--md-comp-dialog-motion-duration) linear,overlay var(--md-comp-dialog-motion-duration) linear allow-discrete,display var(--md-comp-dialog-motion-duration) linear allow-discrete}dialog.micl-dialog[open]::backdrop{background-color:rgba(0, 0, 0, var(--md-sys-state-backdrop-opacity, 32%))}@starting-style{dialog.micl-dialog[open]::backdrop{background-color:rgba(0,0,0,0)}}dialog.micl-dialog.micl-dialog--docked{inset-block:anchor(end) auto;inset-inline:anchor(start) auto;transform:none;transition:none;position-try-fallbacks:flip-block}dialog.micl-dialog .micl-dialog__headline{display:flex;flex-direction:column;flex-shrink:0;align-items:flex-start;gap:16px;padding-block:var(--_padding) var(--md-comp-dialog-headline-space, 16px);padding-inline:var(--_padding);background-color:rgba(0,0,0,0)}dialog.micl-dialog .micl-dialog__headline:has(>.micl-dialog__icon){align-items:center}dialog.micl-dialog .micl-dialog__headline .micl-dialog__icon{--_icon-size: var(--md-comp-dialog-icon-size, var(--md-sys-icon-size, 24px));inline-size:var(--_icon-size);block-size:var(--_icon-size);font-size:var(--_icon-size);color:var(--md-comp-dialog-icon-color, var(--md-sys-color-secondary))}dialog.micl-dialog .micl-dialog__headline :is(h1,h2,h3,h4,h5,h6,.micl-heading){font:var(--md-sys-typescale-headline-small-weight) var(--md-sys-typescale-headline-small-size)/var(--md-sys-typescale-headline-small-line-height) var(--md-sys-typescale-headline-small-font);letter-spacing:var(--md-sys-typescale-headline-small-tracking);flex:1 1 100%;margin:0;color:var(--md-comp-dialog-headline-color, var(--md-sys-color-on-surface))}dialog.micl-dialog .micl-dialog__headline .micl-dialog__subhead{font:var(--md-sys-typescale-title-medium-weight) var(--md-sys-typescale-title-medium-size)/var(--md-sys-typescale-title-medium-line-height) var(--md-sys-typescale-title-medium-font);letter-spacing:var(--md-sys-typescale-title-medium-tracking);padding-inline:var(--_padding);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--md-sys-color-on-surface)}dialog.micl-dialog .micl-dialog__headline:has(+.micl-dialog__actions){padding-block-end:0}dialog.micl-dialog .micl-dialog__supporting-text{font:var(--md-sys-typescale-body-medium-weight) var(--md-sys-typescale-body-medium-size)/var(--md-sys-typescale-body-medium-line-height) var(--md-sys-typescale-body-medium-font);letter-spacing:var(--md-sys-typescale-body-medium-tracking);color:var(--md-comp-dialog-supporting-text-color, var(--md-sys-color-on-surface-variant))}dialog.micl-dialog .micl-dialog__content{flex-shrink:1;padding-inline:var(--_padding);overflow-y:auto}dialog.micl-dialog .micl-dialog__actions{display:flex;flex-shrink:0;justify-content:flex-end;column-gap:8px;padding:var(--_padding);opacity:1;transition:opacity var(--md-comp-dialog-motion-duration) linear allow-discrete,overlay var(--md-comp-dialog-motion-duration) linear allow-discrete,display var(--md-comp-dialog-motion-duration) linear allow-discrete}@media(max-width: 560px){dialog.micl-dialog.micl-dialog--fullscreen{--_dialog-background-color: var(--md-comp-full-screen-dialog-container-color, var(--md-sys-color-surface));inline-size:100vw;block-size:100vh;max-inline-size:100vw;border-radius:var(--md-sys-shape-corner-none, 0px);box-shadow:var(--md-sys-elevation-level0);timeline-scope:--headlineTimeline}dialog.micl-dialog.micl-dialog--fullscreen .micl-dialog__headline{box-sizing:border-box;block-size:56px;flex-direction:row;align-items:center;gap:8px;padding-block:4px;padding-inline:8px 16px;animation-name:headlineScroll;animation-duration:1ms;animation-timeline:--headlineTimeline;animation-fill-mode:forwards;animation-range:0% 20%;z-index:1}dialog.micl-dialog.micl-dialog--fullscreen .micl-dialog__headline :is(h1,h2,h3,h4,h5,h6,.micl-heading){font:var(--md-sys-typescale-title-large-weight) var(--md-sys-typescale-title-large-size)/var(--md-sys-typescale-title-large-line-height) var(--md-sys-typescale-title-large-font);letter-spacing:var(--md-sys-typescale-title-large-tracking);margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}dialog.micl-dialog.micl-dialog--fullscreen .micl-dialog__headline .micl-dialog__icon{display:none}dialog.micl-dialog.micl-dialog--fullscreen .micl-dialog__content{scroll-timeline:--headlineTimeline block;scroll-timeline:--headlineTimeline vertical}dialog.micl-dialog.micl-dialog--fullscreen .micl-dialog__actions{display:none;opacity:0}}@media(min-width: 561px){dialog.micl-dialog.micl-dialog--fullscreen .micl-dialog__fullscreen{display:none}}@media(max-width: 560px){body:has(dialog.micl-dialog.micl-dialog--fullscreen:popover-open){overflow-y:hidden}}@keyframes headlineScroll{from{background-color:rgba(0,0,0,0);box-shadow:var(--md-sys-elevation-level0)}to{background-color:var(--md-sys-color-surface-container);box-shadow:var(--md-sys-elevation-level2)}}