@volverjs/style 0.1.2-beta.16 → 0.1.2-beta.18

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 (21) hide show
  1. package/dist/components/vv-avatar.css +1 -0
  2. package/dist/components/vv-button.css +1 -1
  3. package/dist/components/vv-card.css +1 -1
  4. package/dist/components/vv-input-checkbox-group.css +1 -1
  5. package/dist/components/vv-input-radio-group.css +1 -1
  6. package/dist/components/vv-tooltip.css +1 -1
  7. package/dist/components.css +1 -1
  8. package/dist/themes/dark/components.css +1 -1
  9. package/dist/themes/dark/volver.css +1 -1
  10. package/dist/volver.css +1 -1
  11. package/package.json +7 -5
  12. package/src/_config.scss +1 -0
  13. package/src/components/index.scss +1 -0
  14. package/src/components/vv-avatar.scss +12 -0
  15. package/src/settings/_index.scss +1 -0
  16. package/src/settings/components/_vv-avatar.scss +40 -0
  17. package/src/settings/components/_vv-button.scss +2 -2
  18. package/src/settings/components/_vv-card.scss +0 -1
  19. package/src/settings/components/_vv-input-checkbox-group.scss +1 -0
  20. package/src/settings/components/_vv-tooltip.scss +10 -5
  21. package/src/themes/dark/settings/components/_vv-button.scss +1 -1
package/dist/components/vv-avatar.css ADDED
@@ -0,0 +1 @@
1
+ :where(:host,:root,.theme){--vv-avatar-display: inline-flex;--vv-avatar-justify-content: center;--vv-avatar-align-items: center;--vv-avatar-width: var(--spacing-40);--vv-avatar-height: var(--spacing-40);--vv-avatar-border-radius: 50%;--vv-avatar-border-width: var(--spacing-2);--vv-avatar-border-style: solid;--vv-avatar-border-color: var(--color-surface-4);--vv-avatar-background-color: var(--color-word);--vv-avatar-background-position: center;--vv-avatar-background-size: contain;--vv-avatar-background-repeat: no-repeat;--vv-avatar-color: var(--color-surface);--vv-avatar-object-fit: contain;--vv-avatar-overflow: hidden;--vv-avatar-modifier-small-width: var(--spacing-40);--vv-avatar-modifier-small-height: var(--spacing-40);--vv-avatar-modifier-medium-width: var(--spacing-50);--vv-avatar-modifier-medium-height: var(--spacing-50);--vv-avatar-modifier-medium-font-size: 1.3em;--vv-avatar-modifier-large-width: var(--spacing-64);--vv-avatar-modifier-large-height: var(--spacing-64);--vv-avatar-modifier-large-font-size: 1.7em;--vv-avatar-state-focus-outline: var(--spacing-px) solid var(--color-brand);--vv-avatar-state-focus-outline-offset: var(--spacing-0)}:where(.vv-avatar){display:var(--vv-avatar-display);justify-content:var(--vv-avatar-justify-content);align-items:var(--vv-avatar-align-items);width:var(--vv-avatar-width);height:var(--vv-avatar-height);border-radius:var(--vv-avatar-border-radius);border-width:var(--vv-avatar-border-width);border-style:var(--vv-avatar-border-style);border-color:var(--vv-avatar-border-color);background-color:var(--vv-avatar-background-color);background-position:var(--vv-avatar-background-position);background-size:var(--vv-avatar-background-size);background-repeat:var(--vv-avatar-background-repeat);color:var(--vv-avatar-color);-o-object-fit:var(--vv-avatar-object-fit);object-fit:var(--vv-avatar-object-fit);overflow:var(--vv-avatar-overflow)}:where(.vv-avatar--focus,.vv-avatar.focus,.vv-avatar:not([disabled]):focus){outline:var(--vv-avatar-state-focus-outline);outline-offset:var(--vv-avatar-state-focus-outline-offset)}:where(.vv-avatar--small.vv-avatar){--vv-avatar-width: var(--vv-avatar-modifier-small-width);--vv-avatar-height: var(--vv-avatar-modifier-small-height)}:where(.vv-avatar--medium.vv-avatar){--vv-avatar-width: var(--vv-avatar-modifier-medium-width);--vv-avatar-height: var(--vv-avatar-modifier-medium-height);font-size:var(--vv-avatar-modifier-medium-font-size)}:where(.vv-avatar--large.vv-avatar){--vv-avatar-width: var(--vv-avatar-modifier-large-width);--vv-avatar-height: var(--vv-avatar-modifier-large-height);font-size:var(--vv-avatar-modifier-large-font-size)}
package/dist/components/vv-button.css CHANGED
@@ -1 +1 @@
1
- :where(:host,:root,.theme){--vv-button-position: relative;--vv-button-background: var(--color-brand);--vv-button-border-radius: .5ch;--vv-button-border-style: solid;--vv-button-border-color: var(--color-brand);--vv-button-color: var(--color-white);--vv-button-font-family: var(--font-sans);--vv-button-font-weight: var(--font-semibold);--vv-button-gap: 1ch;--vv-button-line-height: var(--leading-normal);--vv-button-padding-block: .75ch;--vv-button-padding-inline: 1.75ch;--vv-button-text-shadow: 0 1px 0 var(--color-gray-darken-5);--vv-button-transition: all .3s ease-in-out;--vv-button-will-change: all;--vv-button-min-width: 0;--vv-button-state-focus-visible-outline-offset: var(--spacing-4);--vv-button-state-focus-visible-outline: var(--spacing-px) solid var(--color-brand);--vv-button-state-hover-background: var(--color-brand-darken-1);--vv-button-state-hover-border-color: var(--color-brand-darken-1);--vv-button-state-active-background: var(--color-brand-darken-2);--vv-button-state-active-border-color: var(--color-brand-darken-2);--vv-button-state-selected-background: var(--color-brand-darken-2);--vv-button-state-selected-border-color: var(--color-brand-darken-2);--vv-button-state-disabled-opacity: .5;--vv-button-state-disabled-cursor: not-allowed;--vv-button-element-icon-block-size: 1.1em;--vv-button-element-icon-inline-size: 1.1em;--vv-button-element-icon-margin: 0;--vv-button-element-icon-stroke: currentcolor;--vv-button-element-icon-fill: none;--vv-button-element-icon-flex-shrink: 0;--vv-button-element-icon-stroke-linecap: round;--vv-button-element-icon-stroke-linejoin: round;--vv-button-element-label-white-space: nowrap;--vv-button-element-label-text-overflow: ellipsis;--vv-button-element-label-min-width: 0;--vv-button-element-label-overflow: hidden;--vv-button-modifier-primary-background: var(--color-gray-darken-3);--vv-button-modifier-primary-border-color: var(--color-gray-darken-3);--vv-button-modifier-primary-color: var(--color-white);--vv-button-modifier-primary-state-focus-visible-outline: var(--spacing-px) solid var(--color-gray-darken-3);--vv-button-modifier-primary-state-hover-background: var(--color-gray-darken-4);--vv-button-modifier-primary-state-hover-border-color: var(--color-gray-darken-4);--vv-button-modifier-primary-state-active-background: var(--color-gray-darken-5);--vv-button-modifier-primary-state-active-border-color: var(--color-gray-darken-5);--vv-button-modifier-primary-state-selected-background: var(--color-gray-darken-5);--vv-button-modifier-primary-state-selected-border-color: var(--color-gray-darken-5);--vv-button-modifier-secondary-background: var(--color-white);--vv-button-modifier-secondary-border-style: solid;--vv-button-modifier-secondary-border-color: var(--color-gray-lighten-4);--vv-button-modifier-secondary-color: var(--color-word);--vv-button-modifier-secondary-text-shadow: 0 1px 0 var(--color-gray-lighten-5);--vv-button-modifier-secondary-state-focus-visible-outline: var(--spacing-px) solid var(--color-gray-lighten-4);--vv-button-modifier-secondary-state-hover-background: var(--color-gray-lighten-4);--vv-button-modifier-secondary-state-active-background: var(--color-gray-lighten-3);--vv-button-modifier-secondary-state-selected-background: var(--color-gray-lighten-3);--vv-button-modifier-danger-background: var(--color-danger);--vv-button-modifier-danger-border-color: var(--color-danger);--vv-button-modifier-danger-color: var(--color-white);--vv-button-modifier-danger-state-focus-visible-outline: var(--spacing-px) solid var(--color-danger);--vv-button-modifier-danger-state-hover-background: var(--color-danger-darken-1);--vv-button-modifier-danger-state-hover-border-color: var(--color-danger-darken-1);--vv-button-modifier-danger-state-active-background: var(--color-danger-darken-2);--vv-button-modifier-danger-state-active-border-color: var(--color-danger-darken-2);--vv-button-modifier-danger-state-selected-background: var(--color-danger-darken-2);--vv-button-modifier-danger-state-selected-border-color: var(--color-danger-darken-2);--vv-button-modifier-ghost-background: transparent;--vv-button-modifier-ghost-border-color: transparent;--vv-button-modifier-ghost-color: var(--color-gray);--vv-button-modifier-ghost-text-shadow: 0 1px 0 var(--color-gray-lighten-5);--vv-button-modifier-ghost-state-focus-visible-outline: var(--spacing-px) solid var(--color-gray-lighten-4);--vv-button-modifier-ghost-state-focus-visible-outline-offset: 0;--vv-button-modifier-ghost-state-hover-background: var(--color-gray-lighten-5);--vv-button-modifier-ghost-state-active-background: var(--color-gray-lighten-4);--vv-button-modifier-ghost-state-selected-background: var(--color-gray-lighten-4);--vv-button-modifier-link-background: transparent;--vv-button-modifier-link-border-color: var(--color-word);--vv-button-modifier-link-border-width: var(--border-0);--vv-button-modifier-link-border-radius: 0;--vv-button-modifier-link-padding: 0;--vv-button-modifier-link-color: var(--color-word);--vv-button-modifier-link-text-shadow: 0 1px 0 var(--color-gray-lighten-5);--vv-button-modifier-link-state-focus-visible-color: var(--color-brand);--vv-button-modifier-link-state-focus-visible-outline: none;--vv-button-modifier-link-state-hover-text-decoration: underline;--vv-button-modifier-link-state-hover-text-underline-offset: var(--spacing-4);--vv-button-modifier-static-light-background: var(--color-white);--vv-button-modifier-static-light-border-color: var(--color-white);--vv-button-modifier-static-light-color: var(--color-black);--vv-button-modifier-static-light-text-shadow: 0 1px 0 var(--color-gray-lighten-5);--vv-button-modifier-static-light-state-focus-visible-outline: var(--spacing-px) solid var(--color-gray-lighten-4);--vv-button-modifier-static-light-state-hover-border-color: var(--color-gray-lighten-5);--vv-button-modifier-static-light-state-hover-background: var(--color-gray-lighten-5);--vv-button-modifier-static-light-state-active-border-color: var(--color-gray-lighten-4);--vv-button-modifier-static-light-state-active-background: var(--color-gray-lighten-4);--vv-button-modifier-static-light-state-selected-border-color: var(--color-gray-lighten-4);--vv-button-modifier-static-light-state-selected-background: var(--color-gray-lighten-4);--vv-button-modifier-static-dark-background: var(--color-black);--vv-button-modifier-static-dark-border-color: var(--color-black);--vv-button-modifier-static-dark-color: var(--color-white);--vv-button-modifier-static-dark-text-shadow: 0 1px 0 var(--color-gray-darken-5);--vv-button-modifier-static-dark-state-focus-visible-outline: var(--spacing-px) solid var(--color-gray-darken-4);--vv-button-modifier-static-dark-state-hover-border-color: var(--color-gray-darken-4);--vv-button-modifier-static-dark-state-hover-background: var(--color-gray-darken-4);--vv-button-modifier-static-dark-state-active-border-color: var(--color-gray-darken-3);--vv-button-modifier-static-dark-state-active-background: var(--color-gray-darken-3);--vv-button-modifier-static-dark-state-selected-border-color: var(--color-gray-darken-3);--vv-button-modifier-static-dark-state-selected-background: var(--color-gray-darken-3);--vv-button-modifier-action-font-size: .875em;--vv-button-modifier-action-background: var(--color-surface-1);--vv-button-modifier-action-color: var(--color-word-1);--vv-button-modifier-action-border-color: var(--color-word-5);--vv-button-modifier-action-font-weight: var(--font-normal);--vv-button-modifier-action-padding-inline: .75ch;--vv-button-modifier-action-padding-block: .5ch;--vv-button-modifier-action-line-height: var(--leading-snug);--vv-button-modifier-action-text-shadow: none;--vv-button-modifier-action-state-focus-visible-outline: var(--spacing-px) solid var(--color-gray-lighten-4);--vv-button-modifier-action-state-hover-background: var(--color-surface-2);--vv-button-modifier-action-state-active-background: var(--color-surface-5);--vv-button-modifier-action-state-selected-color: var(--color-white);--vv-button-modifier-action-state-selected-background: var(--color-gray);--vv-button-modifier-action-state-selected-border-color: var(--color-gray);--vv-button-modifier-action-element-icon-margin-inline: -.125ch;--vv-button-modifier-action-element-icon-block-size: calc(1em * var(--leading-snug));--vv-button-modifier-action-element-icon-inline-size: calc(1em * var(--leading-snug));--vv-button-modifier-action-quiet-font-size: var(--text-14);--vv-button-modifier-action-quiet-background: transparent;--vv-button-modifier-action-quiet-color: var(--color-word-1);--vv-button-modifier-action-quiet-border-color: transparent;--vv-button-modifier-action-quiet-font-weight: var(--font-normal);--vv-button-modifier-action-quiet-padding-inline: .75ch;--vv-button-modifier-action-quiet-padding-block: .5ch;--vv-button-modifier-action-quiet-line-height: var(--leading-snug);--vv-button-modifier-action-quiet-text-shadow: none;--vv-button-modifier-action-quiet-state-focus-visible-outline: var(--spacing-px) solid var(--color-gray-lighten-4);--vv-button-modifier-action-quiet-state-focus-visible-outline-offset: 0;--vv-button-modifier-action-quiet-state-hover-background: var(--color-surface-2);--vv-button-modifier-action-quiet-state-hover-border-color: var(--color-surface-2);--vv-button-modifier-action-quiet-state-active-background: var(--color-surface-5);--vv-button-modifier-action-quiet-state-active-border-color: var(--color-surface-5);--vv-button-modifier-action-quiet-state-selected-color: var(--color-white);--vv-button-modifier-action-quiet-state-selected-background: var(--color-gray);--vv-button-modifier-action-quiet-state-selected-border-color: var(--color-gray);--vv-button-modifier-action-quiet-element-icon-margin-inline: -.125ch;--vv-button-modifier-action-quiet-element-icon-block-size: calc(1em * var(--leading-snug));--vv-button-modifier-action-quiet-element-icon-inline-size: calc(1em * var(--leading-snug));--vv-button-modifier-rounded-border-radius: var(--rounded-full);--vv-button-modifier-rounded-element-icon-margin: 0 -1ch;--vv-button-modifier-block-display: block;--vv-button-modifier-block-width: 100%;--vv-button-modifier-block-max-width: auto;--vv-button-modifier-reverse-element-label-order: -1;--vv-button-modifier-column-flex-direction: column;--vv-button-modifier-column-gap: .2em;--vv-button-modifier-full-bleed-min-width: 20ch}:where(.vv-button):where(a[href],button,input[type=button],input[type=submit],input[type=reset]),:where(.vv-button)::file-selector-button{-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;align-items:center;cursor:pointer;display:inline-flex;justify-content:center;text-align:center;touch-action:manipulation;-webkit-user-select:none;-moz-user-select:none;user-select:none;--button-border-width: var(--border-2);position:var(--vv-button-position);background:var(--vv-button-background);border-radius:var(--vv-button-border-radius);border-width:var(--button-border-width);border-style:var(--vv-button-border-style);border-color:var(--vv-button-border-color);color:var(--vv-button-color);font-family:var(--vv-button-font-family);font-weight:var(--vv-button-font-weight);gap:var(--vv-button-gap);line-height:var(--vv-button-line-height);padding-block:var(--vv-button-padding-block);padding-inline:var(--vv-button-padding-inline);text-shadow:var(--vv-button-text-shadow);transition:var(--vv-button-transition);will-change:var(--vv-button-will-change);min-width:var(--vv-button-min-width)}@media (prefers-reduced-motion: reduce){:where(.vv-button):where(a[href],button,input[type=button],input[type=submit],input[type=reset]),:where(.vv-button)::file-selector-button{transition:none}}:where(.vv-button)::file-selector-button{-webkit-margin-end:var(--vv-button-gap, 1ch);margin-inline-end:var(--vv-button-gap, 1ch)}:where(.vv-button__icon,.vv-button > :where(svg,[data-icon])){block-size:var(--vv-button-element-icon-block-size);inline-size:var(--vv-button-element-icon-inline-size);margin:var(--vv-button-element-icon-margin);stroke:var(--vv-button-element-icon-stroke);fill:var(--vv-button-element-icon-fill);flex-shrink:var(--vv-button-element-icon-flex-shrink);stroke-linecap:var(--vv-button-element-icon-stroke-linecap);stroke-linejoin:var(--vv-button-element-icon-stroke-linejoin)}:where(.vv-button__label){white-space:var(--vv-button-element-label-white-space);text-overflow:var(--vv-button-element-label-text-overflow);min-width:var(--vv-button-element-label-min-width);overflow:var(--vv-button-element-label-overflow)}:where(.vv-button--focus-visible,.vv-button.focus-visible,.vv-button:not(:active):not([disabled]):not([tabindex="-1"]:not([aria-disabled=true])):focus-visible){outline-offset:var(--vv-button-state-focus-visible-outline-offset);outline:var(--vv-button-state-focus-visible-outline)}:where(.vv-button--hover,.vv-button.hover,.vv-button:not([disabled]):hover){--vv-button-background: var(--vv-button-state-hover-background);--vv-button-border-color: var(--vv-button-state-hover-border-color)}:where(.vv-button--active,.vv-button.active,.vv-button:not([disabled]):active){--vv-button-background: var(--vv-button-state-active-background);--vv-button-border-color: var(--vv-button-state-active-border-color)}:where(.vv-button--selected,.vv-button.selected,.vv-button[aria-selected=true]){--vv-button-background: var(--vv-button-state-selected-background);--vv-button-border-color: var(--vv-button-state-selected-border-color)}:where(.vv-button--disabled,.vv-button.disabled,.vv-button[disabled],.vv-button[aria-disabled=true]){opacity:var(--vv-button-state-disabled-opacity);cursor:var(--vv-button-state-disabled-cursor)}:where(.vv-button--primary.vv-button){--vv-button-background: var(--vv-button-modifier-primary-background);--vv-button-border-color: var(--vv-button-modifier-primary-border-color);--vv-button-color: var(--vv-button-modifier-primary-color)}:where(.vv-button--primary.vv-button--focus-visible,.vv-button--primary.vv-button.focus-visible,.vv-button--primary.vv-button:not(:active):not([disabled]):not([tabindex="-1"]:not([aria-disabled=true])):focus-visible){outline:var(--vv-button-modifier-primary-state-focus-visible-outline)}:where(.vv-button--primary.vv-button--hover,.vv-button--primary.vv-button.hover,.vv-button--primary.vv-button:not([disabled]):hover){--vv-button-modifier-primary-background: var(--vv-button-modifier-primary-state-hover-background);--vv-button-modifier-primary-border-color: var(--vv-button-modifier-primary-state-hover-border-color)}:where(.vv-button--primary.vv-button--active,.vv-button--primary.vv-button.active,.vv-button--primary.vv-button:not([disabled]):active){--vv-button-modifier-primary-background: var(--vv-button-modifier-primary-state-active-background);--vv-button-modifier-primary-border-color: var(--vv-button-modifier-primary-state-active-border-color)}:where(.vv-button--primary.vv-button--selected,.vv-button--primary.vv-button.selected,.vv-button--primary.vv-button[aria-selected=true]){--vv-button-modifier-primary-background: var(--vv-button-modifier-primary-state-selected-background);--vv-button-modifier-primary-border-color: var(--vv-button-modifier-primary-state-selected-border-color)}:where(.vv-button--secondary.vv-button){--vv-button-background: var(--vv-button-modifier-secondary-background);--vv-button-border-style: var(--vv-button-modifier-secondary-border-style);--vv-button-border-color: var(--vv-button-modifier-secondary-border-color);--vv-button-color: var(--vv-button-modifier-secondary-color);--vv-button-text-shadow: var(--vv-button-modifier-secondary-text-shadow)}:where(.vv-button--secondary.vv-button--focus-visible,.vv-button--secondary.vv-button.focus-visible,.vv-button--secondary.vv-button:not(:active):not([disabled]):not([tabindex="-1"]:not([aria-disabled=true])):focus-visible){outline:var(--vv-button-modifier-secondary-state-focus-visible-outline)}:where(.vv-button--secondary.vv-button--hover,.vv-button--secondary.vv-button.hover,.vv-button--secondary.vv-button:not([disabled]):hover){--vv-button-modifier-secondary-background: var(--vv-button-modifier-secondary-state-hover-background)}:where(.vv-button--secondary.vv-button--active,.vv-button--secondary.vv-button.active,.vv-button--secondary.vv-button:not([disabled]):active){--vv-button-modifier-secondary-background: var(--vv-button-modifier-secondary-state-active-background)}:where(.vv-button--secondary.vv-button--selected,.vv-button--secondary.vv-button.selected,.vv-button--secondary.vv-button[aria-selected=true]){--vv-button-modifier-secondary-background: var(--vv-button-modifier-secondary-state-selected-background)}:where(.vv-button--danger.vv-button){--vv-button-background: var(--vv-button-modifier-danger-background);--vv-button-border-color: var(--vv-button-modifier-danger-border-color);--vv-button-color: var(--vv-button-modifier-danger-color)}:where(.vv-button--danger.vv-button--focus-visible,.vv-button--danger.vv-button.focus-visible,.vv-button--danger.vv-button:not(:active):not([disabled]):not([tabindex="-1"]:not([aria-disabled=true])):focus-visible){outline:var(--vv-button-modifier-danger-state-focus-visible-outline)}:where(.vv-button--danger.vv-button--hover,.vv-button--danger.vv-button.hover,.vv-button--danger.vv-button:not([disabled]):hover){--vv-button-modifier-danger-background: var(--vv-button-modifier-danger-state-hover-background);--vv-button-modifier-danger-border-color: var(--vv-button-modifier-danger-state-hover-border-color)}:where(.vv-button--danger.vv-button--active,.vv-button--danger.vv-button.active,.vv-button--danger.vv-button:not([disabled]):active){--vv-button-modifier-danger-background: var(--vv-button-modifier-danger-state-active-background);--vv-button-modifier-danger-border-color: var(--vv-button-modifier-danger-state-active-border-color)}:where(.vv-button--danger.vv-button--selected,.vv-button--danger.vv-button.selected,.vv-button--danger.vv-button[aria-selected=true]){--vv-button-modifier-danger-background: var(--vv-button-modifier-danger-state-selected-background);--vv-button-modifier-danger-border-color: var(--vv-button-modifier-danger-state-selected-border-color)}:where(.vv-button--ghost.vv-button){--vv-button-background: var(--vv-button-modifier-ghost-background);--vv-button-border-color: var(--vv-button-modifier-ghost-border-color);--vv-button-color: var(--vv-button-modifier-ghost-color);--vv-button-text-shadow: var(--vv-button-modifier-ghost-text-shadow)}:where(.vv-button--ghost.vv-button--focus-visible,.vv-button--ghost.vv-button.focus-visible,.vv-button--ghost.vv-button:not(:active):not([disabled]):not([tabindex="-1"]:not([aria-disabled=true])):focus-visible){outline:var(--vv-button-modifier-ghost-state-focus-visible-outline);outline-offset:var(--vv-button-modifier-ghost-state-focus-visible-outline-offset)}:where(.vv-button--ghost.vv-button--hover,.vv-button--ghost.vv-button.hover,.vv-button--ghost.vv-button:not([disabled]):hover){--vv-button-modifier-ghost-background: var(--vv-button-modifier-ghost-state-hover-background)}:where(.vv-button--ghost.vv-button--active,.vv-button--ghost.vv-button.active,.vv-button--ghost.vv-button:not([disabled]):active){--vv-button-modifier-ghost-background: var(--vv-button-modifier-ghost-state-active-background)}:where(.vv-button--ghost.vv-button--selected,.vv-button--ghost.vv-button.selected,.vv-button--ghost.vv-button[aria-selected=true]){--vv-button-modifier-ghost-background: var(--vv-button-modifier-ghost-state-selected-background)}:where(.vv-button--link.vv-button){--vv-button-background: var(--vv-button-modifier-link-background);--vv-button-border-color: var(--vv-button-modifier-link-border-color);border-width:var(--vv-button-modifier-link-border-width);--vv-button-border-radius: var(--vv-button-modifier-link-border-radius);padding:var(--vv-button-modifier-link-padding);--vv-button-color: var(--vv-button-modifier-link-color);--vv-button-text-shadow: var(--vv-button-modifier-link-text-shadow)}:where(.vv-button--link.vv-button--focus-visible,.vv-button--link.vv-button.focus-visible,.vv-button--link.vv-button:not(:active):not([disabled]):not([tabindex="-1"]:not([aria-disabled=true])):focus-visible){--vv-button-modifier-link-color: var(--vv-button-modifier-link-state-focus-visible-color);outline:var(--vv-button-modifier-link-state-focus-visible-outline)}:where(.vv-button--link.vv-button--hover,.vv-button--link.vv-button.hover,.vv-button--link.vv-button:not([disabled]):hover){-webkit-text-decoration:var(--vv-button-modifier-link-state-hover-text-decoration);text-decoration:var(--vv-button-modifier-link-state-hover-text-decoration);text-underline-offset:var(--vv-button-modifier-link-state-hover-text-underline-offset)}:where(.vv-button--static-light.vv-button){--vv-button-background: var(--vv-button-modifier-static-light-background);--vv-button-border-color: var(--vv-button-modifier-static-light-border-color);--vv-button-color: var(--vv-button-modifier-static-light-color);--vv-button-text-shadow: var(--vv-button-modifier-static-light-text-shadow)}:where(.vv-button--static-light.vv-button--focus-visible,.vv-button--static-light.vv-button.focus-visible,.vv-button--static-light.vv-button:not(:active):not([disabled]):not([tabindex="-1"]:not([aria-disabled=true])):focus-visible){outline:var(--vv-button-modifier-static-light-state-focus-visible-outline)}:where(.vv-button--static-light.vv-button--hover,.vv-button--static-light.vv-button.hover,.vv-button--static-light.vv-button:not([disabled]):hover){--vv-button-modifier-static-light-border-color: var(--vv-button-modifier-static-light-state-hover-border-color);--vv-button-modifier-static-light-background: var(--vv-button-modifier-static-light-state-hover-background)}:where(.vv-button--static-light.vv-button--active,.vv-button--static-light.vv-button.active,.vv-button--static-light.vv-button:not([disabled]):active){--vv-button-modifier-static-light-border-color: var(--vv-button-modifier-static-light-state-active-border-color);--vv-button-modifier-static-light-background: var(--vv-button-modifier-static-light-state-active-background)}:where(.vv-button--static-light.vv-button--selected,.vv-button--static-light.vv-button.selected,.vv-button--static-light.vv-button[aria-selected=true]){--vv-button-modifier-static-light-border-color: var(--vv-button-modifier-static-light-state-selected-border-color);--vv-button-modifier-static-light-background: var(--vv-button-modifier-static-light-state-selected-background)}:where(.vv-button--static-dark.vv-button){--vv-button-background: var(--vv-button-modifier-static-dark-background);--vv-button-border-color: var(--vv-button-modifier-static-dark-border-color);--vv-button-color: var(--vv-button-modifier-static-dark-color);--vv-button-text-shadow: var(--vv-button-modifier-static-dark-text-shadow)}:where(.vv-button--static-dark.vv-button--focus-visible,.vv-button--static-dark.vv-button.focus-visible,.vv-button--static-dark.vv-button:not(:active):not([disabled]):not([tabindex="-1"]:not([aria-disabled=true])):focus-visible){outline:var(--vv-button-modifier-static-dark-state-focus-visible-outline)}:where(.vv-button--static-dark.vv-button--hover,.vv-button--static-dark.vv-button.hover,.vv-button--static-dark.vv-button:not([disabled]):hover){--vv-button-modifier-static-dark-border-color: var(--vv-button-modifier-static-dark-state-hover-border-color);--vv-button-modifier-static-dark-background: var(--vv-button-modifier-static-dark-state-hover-background)}:where(.vv-button--static-dark.vv-button--active,.vv-button--static-dark.vv-button.active,.vv-button--static-dark.vv-button:not([disabled]):active){--vv-button-modifier-static-dark-border-color: var(--vv-button-modifier-static-dark-state-active-border-color);--vv-button-modifier-static-dark-background: var(--vv-button-modifier-static-dark-state-active-background)}:where(.vv-button--static-dark.vv-button--selected,.vv-button--static-dark.vv-button.selected,.vv-button--static-dark.vv-button[aria-selected=true]){--vv-button-modifier-static-dark-border-color: var(--vv-button-modifier-static-dark-state-selected-border-color);--vv-button-modifier-static-dark-background: var(--vv-button-modifier-static-dark-state-selected-background)}:where(.vv-button--action.vv-button){--button-border-width: var(--border);font-size:var(--vv-button-modifier-action-font-size);--vv-button-background: var(--vv-button-modifier-action-background);--vv-button-color: var(--vv-button-modifier-action-color);--vv-button-border-color: var(--vv-button-modifier-action-border-color);--vv-button-font-weight: var(--vv-button-modifier-action-font-weight);--vv-button-padding-inline: var(--vv-button-modifier-action-padding-inline);--vv-button-padding-block: var(--vv-button-modifier-action-padding-block);--vv-button-line-height: var(--vv-button-modifier-action-line-height);--vv-button-text-shadow: var(--vv-button-modifier-action-text-shadow)}:where(.vv-button--action .vv-button__icon,.vv-button--action > :where(svg,[data-icon])){margin-inline:var(--vv-button-modifier-action-element-icon-margin-inline);block-size:var(--vv-button-modifier-action-element-icon-block-size);inline-size:var(--vv-button-modifier-action-element-icon-inline-size)}:where(.vv-button--action.vv-button--focus-visible,.vv-button--action.vv-button.focus-visible,.vv-button--action.vv-button:not(:active):not([disabled]):not([tabindex="-1"]:not([aria-disabled=true])):focus-visible){outline:var(--vv-button-modifier-action-state-focus-visible-outline)}:where(.vv-button--action.vv-button--hover,.vv-button--action.vv-button.hover,.vv-button--action.vv-button:not([disabled]):hover){--vv-button-modifier-action-background: var(--vv-button-modifier-action-state-hover-background)}:where(.vv-button--action.vv-button--active,.vv-button--action.vv-button.active,.vv-button--action.vv-button:not([disabled]):active){--vv-button-modifier-action-background: var(--vv-button-modifier-action-state-active-background)}:where(.vv-button--action.vv-button--selected,.vv-button--action.vv-button.selected,.vv-button--action.vv-button[aria-selected=true]){--vv-button-modifier-action-color: var(--vv-button-modifier-action-state-selected-color);--vv-button-modifier-action-background: var(--vv-button-modifier-action-state-selected-background);--vv-button-modifier-action-border-color: var(--vv-button-modifier-action-state-selected-border-color)}:where(.vv-button--action-quiet.vv-button){--button-border-width: var(--border);font-size:var(--vv-button-modifier-action-quiet-font-size);--vv-button-background: var(--vv-button-modifier-action-quiet-background);--vv-button-color: var(--vv-button-modifier-action-quiet-color);--vv-button-border-color: var(--vv-button-modifier-action-quiet-border-color);--vv-button-font-weight: var(--vv-button-modifier-action-quiet-font-weight);--vv-button-padding-inline: var(--vv-button-modifier-action-quiet-padding-inline);--vv-button-padding-block: var(--vv-button-modifier-action-quiet-padding-block);--vv-button-line-height: var(--vv-button-modifier-action-quiet-line-height);--vv-button-text-shadow: var(--vv-button-modifier-action-quiet-text-shadow)}:where(.vv-button--action-quiet .vv-button__icon,.vv-button--action-quiet > :where(svg,[data-icon])){margin-inline:var(--vv-button-modifier-action-quiet-element-icon-margin-inline);block-size:var(--vv-button-modifier-action-quiet-element-icon-block-size);inline-size:var(--vv-button-modifier-action-quiet-element-icon-inline-size)}:where(.vv-button--action-quiet.vv-button--focus-visible,.vv-button--action-quiet.vv-button.focus-visible,.vv-button--action-quiet.vv-button:not(:active):not([disabled]):not([tabindex="-1"]:not([aria-disabled=true])):focus-visible){outline:var(--vv-button-modifier-action-quiet-state-focus-visible-outline);outline-offset:var(--vv-button-modifier-action-quiet-state-focus-visible-outline-offset)}:where(.vv-button--action-quiet.vv-button--hover,.vv-button--action-quiet.vv-button.hover,.vv-button--action-quiet.vv-button:not([disabled]):hover){--vv-button-modifier-action-quiet-background: var(--vv-button-modifier-action-quiet-state-hover-background);--vv-button-modifier-action-quiet-border-color: var(--vv-button-modifier-action-quiet-state-hover-border-color)}:where(.vv-button--action-quiet.vv-button--active,.vv-button--action-quiet.vv-button.active,.vv-button--action-quiet.vv-button:not([disabled]):active){--vv-button-modifier-action-quiet-background: var(--vv-button-modifier-action-quiet-state-active-background);--vv-button-modifier-action-quiet-border-color: var(--vv-button-modifier-action-quiet-state-active-border-color)}:where(.vv-button--action-quiet.vv-button--selected,.vv-button--action-quiet.vv-button.selected,.vv-button--action-quiet.vv-button[aria-selected=true]){--vv-button-modifier-action-quiet-color: var(--vv-button-modifier-action-quiet-state-selected-color);--vv-button-modifier-action-quiet-background: var(--vv-button-modifier-action-quiet-state-selected-background);--vv-button-modifier-action-quiet-border-color: var(--vv-button-modifier-action-quiet-state-selected-border-color)}:where(.vv-button--rounded.vv-button){--vv-button-border-radius: var(--vv-button-modifier-rounded-border-radius)}:where(.vv-button--rounded .vv-button__icon,.vv-button--rounded > :where(svg,[data-icon])){margin:var(--vv-button-modifier-rounded-element-icon-margin)}:where(.vv-button--block.vv-button){display:var(--vv-button-modifier-block-display);width:var(--vv-button-modifier-block-width);max-width:var(--vv-button-modifier-block-max-width)}:where(.vv-button--reverse .vv-button__label){order:var(--vv-button-modifier-reverse-element-label-order)}:where(.vv-button--column.vv-button){flex-direction:var(--vv-button-modifier-column-flex-direction);--vv-button-gap: var(--vv-button-modifier-column-gap)}:where(.vv-button--full-bleed.vv-button){--vv-button-min-width: var(--vv-button-modifier-full-bleed-min-width)}
1
+ :where(:host,:root,.theme){--vv-button-position: relative;--vv-button-background: var(--color-brand);--vv-button-border-radius: .5ch;--vv-button-border-style: solid;--vv-button-border-color: var(--color-brand);--vv-button-color: var(--color-white);--vv-button-font-family: var(--font-sans);--vv-button-font-weight: var(--font-semibold);--vv-button-gap: 1ch;--vv-button-line-height: var(--leading-normal);--vv-button-padding-block: .75ch;--vv-button-padding-inline: 1.75ch;--vv-button-text-shadow: 0 1px 0 var(--color-gray-darken-5);--vv-button-transition: all .3s ease-in-out;--vv-button-will-change: all;--vv-button-min-width: 0;--vv-button-state-focus-visible-outline-offset: var(--spacing-4);--vv-button-state-focus-visible-outline: var(--spacing-px) solid var(--color-brand);--vv-button-state-hover-background: var(--color-brand-darken-1);--vv-button-state-hover-border-color: var(--color-brand-darken-1);--vv-button-state-active-background: var(--color-brand-darken-2);--vv-button-state-active-border-color: var(--color-brand-darken-2);--vv-button-state-selected-background: var(--color-brand-darken-2);--vv-button-state-selected-border-color: var(--color-brand-darken-2);--vv-button-state-disabled-opacity: .5;--vv-button-state-disabled-cursor: not-allowed;--vv-button-element-icon-block-size: 1.1em;--vv-button-element-icon-inline-size: 1.1em;--vv-button-element-icon-margin: 0;--vv-button-element-icon-stroke: currentcolor;--vv-button-element-icon-fill: none;--vv-button-element-icon-flex-shrink: 0;--vv-button-element-icon-stroke-linecap: round;--vv-button-element-icon-stroke-linejoin: round;--vv-button-element-label-white-space: nowrap;--vv-button-element-label-text-overflow: ellipsis;--vv-button-element-label-min-width: 0;--vv-button-element-label-overflow: hidden;--vv-button-modifier-primary-background: var(--color-gray-darken-3);--vv-button-modifier-primary-border-color: var(--color-gray-darken-3);--vv-button-modifier-primary-color: var(--color-white);--vv-button-modifier-primary-state-focus-visible-outline: var(--spacing-px) solid var(--color-gray-darken-3);--vv-button-modifier-primary-state-hover-background: var(--color-gray-darken-4);--vv-button-modifier-primary-state-hover-border-color: var(--color-gray-darken-4);--vv-button-modifier-primary-state-active-background: var(--color-gray-darken-5);--vv-button-modifier-primary-state-active-border-color: var(--color-gray-darken-5);--vv-button-modifier-primary-state-selected-background: var(--color-gray-darken-5);--vv-button-modifier-primary-state-selected-border-color: var(--color-gray-darken-5);--vv-button-modifier-secondary-background: var(--color-white);--vv-button-modifier-secondary-border-style: solid;--vv-button-modifier-secondary-border-color: var(--color-gray-lighten-4);--vv-button-modifier-secondary-color: var(--color-word);--vv-button-modifier-secondary-text-shadow: 0 1px 0 var(--color-gray-lighten-5);--vv-button-modifier-secondary-state-focus-visible-outline: var(--spacing-px) solid var(--color-gray-lighten-4);--vv-button-modifier-secondary-state-hover-background: var(--color-gray-lighten-4);--vv-button-modifier-secondary-state-active-background: var(--color-gray-lighten-3);--vv-button-modifier-secondary-state-selected-background: var(--color-gray-lighten-3);--vv-button-modifier-danger-background: var(--color-danger);--vv-button-modifier-danger-border-color: var(--color-danger);--vv-button-modifier-danger-color: var(--color-white);--vv-button-modifier-danger-state-focus-visible-outline: var(--spacing-px) solid var(--color-danger);--vv-button-modifier-danger-state-hover-background: var(--color-danger-darken-1);--vv-button-modifier-danger-state-hover-border-color: var(--color-danger-darken-1);--vv-button-modifier-danger-state-active-background: var(--color-danger-darken-2);--vv-button-modifier-danger-state-active-border-color: var(--color-danger-darken-2);--vv-button-modifier-danger-state-selected-background: var(--color-danger-darken-2);--vv-button-modifier-danger-state-selected-border-color: var(--color-danger-darken-2);--vv-button-modifier-ghost-background: transparent;--vv-button-modifier-ghost-border-color: transparent;--vv-button-modifier-ghost-color: var(--color-gray);--vv-button-modifier-ghost-text-shadow: 0 1px 0 var(--color-gray-lighten-5);--vv-button-modifier-ghost-state-focus-visible-outline: var(--spacing-px) solid var(--color-gray-lighten-4);--vv-button-modifier-ghost-state-focus-visible-outline-offset: var(--spacing-0);--vv-button-modifier-ghost-state-hover-background: var(--color-gray-lighten-5);--vv-button-modifier-ghost-state-active-background: var(--color-gray-lighten-4);--vv-button-modifier-ghost-state-selected-background: var(--color-gray-lighten-4);--vv-button-modifier-link-background: transparent;--vv-button-modifier-link-border-color: var(--color-word);--vv-button-modifier-link-border-width: var(--border-0);--vv-button-modifier-link-border-radius: 0;--vv-button-modifier-link-padding: 0;--vv-button-modifier-link-color: var(--color-word);--vv-button-modifier-link-text-shadow: 0 1px 0 var(--color-gray-lighten-5);--vv-button-modifier-link-state-focus-visible-color: var(--color-brand);--vv-button-modifier-link-state-focus-visible-outline: none;--vv-button-modifier-link-state-hover-text-decoration: underline;--vv-button-modifier-link-state-hover-text-underline-offset: var(--spacing-4);--vv-button-modifier-static-light-background: var(--color-white);--vv-button-modifier-static-light-border-color: var(--color-white);--vv-button-modifier-static-light-color: var(--color-black);--vv-button-modifier-static-light-text-shadow: 0 1px 0 var(--color-gray-lighten-5);--vv-button-modifier-static-light-state-focus-visible-outline: var(--spacing-px) solid var(--color-gray-lighten-4);--vv-button-modifier-static-light-state-hover-border-color: var(--color-gray-lighten-5);--vv-button-modifier-static-light-state-hover-background: var(--color-gray-lighten-5);--vv-button-modifier-static-light-state-active-border-color: var(--color-gray-lighten-4);--vv-button-modifier-static-light-state-active-background: var(--color-gray-lighten-4);--vv-button-modifier-static-light-state-selected-border-color: var(--color-gray-lighten-4);--vv-button-modifier-static-light-state-selected-background: var(--color-gray-lighten-4);--vv-button-modifier-static-dark-background: var(--color-black);--vv-button-modifier-static-dark-border-color: var(--color-black);--vv-button-modifier-static-dark-color: var(--color-white);--vv-button-modifier-static-dark-text-shadow: 0 1px 0 var(--color-gray-darken-5);--vv-button-modifier-static-dark-state-focus-visible-outline: var(--spacing-px) solid var(--color-gray-darken-4);--vv-button-modifier-static-dark-state-hover-border-color: var(--color-gray-darken-4);--vv-button-modifier-static-dark-state-hover-background: var(--color-gray-darken-4);--vv-button-modifier-static-dark-state-active-border-color: var(--color-gray-darken-3);--vv-button-modifier-static-dark-state-active-background: var(--color-gray-darken-3);--vv-button-modifier-static-dark-state-selected-border-color: var(--color-gray-darken-3);--vv-button-modifier-static-dark-state-selected-background: var(--color-gray-darken-3);--vv-button-modifier-action-font-size: .875em;--vv-button-modifier-action-background: var(--color-surface-1);--vv-button-modifier-action-color: var(--color-word-1);--vv-button-modifier-action-border-color: var(--color-word-5);--vv-button-modifier-action-font-weight: var(--font-normal);--vv-button-modifier-action-padding-inline: .75ch;--vv-button-modifier-action-padding-block: .5ch;--vv-button-modifier-action-line-height: var(--leading-snug);--vv-button-modifier-action-text-shadow: none;--vv-button-modifier-action-state-focus-visible-outline: var(--spacing-px) solid var(--color-gray-lighten-4);--vv-button-modifier-action-state-hover-background: var(--color-surface-2);--vv-button-modifier-action-state-active-background: var(--color-surface-5);--vv-button-modifier-action-state-selected-color: var(--color-white);--vv-button-modifier-action-state-selected-background: var(--color-gray);--vv-button-modifier-action-state-selected-border-color: var(--color-gray);--vv-button-modifier-action-element-icon-margin-inline: -.125ch;--vv-button-modifier-action-element-icon-block-size: calc(1em * var(--leading-snug));--vv-button-modifier-action-element-icon-inline-size: calc(1em * var(--leading-snug));--vv-button-modifier-action-quiet-font-size: var(--text-14);--vv-button-modifier-action-quiet-background: transparent;--vv-button-modifier-action-quiet-color: var(--color-word-1);--vv-button-modifier-action-quiet-border-color: transparent;--vv-button-modifier-action-quiet-font-weight: var(--font-normal);--vv-button-modifier-action-quiet-padding-inline: .75ch;--vv-button-modifier-action-quiet-padding-block: .5ch;--vv-button-modifier-action-quiet-line-height: var(--leading-snug);--vv-button-modifier-action-quiet-text-shadow: none;--vv-button-modifier-action-quiet-state-focus-visible-outline: var(--spacing-px) solid var(--color-gray-lighten-4);--vv-button-modifier-action-quiet-state-focus-visible-outline-offset: var(--spacing-0);--vv-button-modifier-action-quiet-state-hover-background: var(--color-surface-2);--vv-button-modifier-action-quiet-state-hover-border-color: var(--color-surface-2);--vv-button-modifier-action-quiet-state-active-background: var(--color-surface-5);--vv-button-modifier-action-quiet-state-active-border-color: var(--color-surface-5);--vv-button-modifier-action-quiet-state-selected-color: var(--color-white);--vv-button-modifier-action-quiet-state-selected-background: var(--color-gray);--vv-button-modifier-action-quiet-state-selected-border-color: var(--color-gray);--vv-button-modifier-action-quiet-element-icon-margin-inline: -.125ch;--vv-button-modifier-action-quiet-element-icon-block-size: calc(1em * var(--leading-snug));--vv-button-modifier-action-quiet-element-icon-inline-size: calc(1em * var(--leading-snug));--vv-button-modifier-rounded-border-radius: var(--rounded-full);--vv-button-modifier-rounded-element-icon-margin: 0 -1ch;--vv-button-modifier-block-display: block;--vv-button-modifier-block-width: 100%;--vv-button-modifier-block-max-width: auto;--vv-button-modifier-reverse-element-label-order: -1;--vv-button-modifier-column-flex-direction: column;--vv-button-modifier-column-gap: .2em;--vv-button-modifier-full-bleed-min-width: 20ch}:where(.vv-button):where(a[href],button,input[type=button],input[type=submit],input[type=reset]),:where(.vv-button)::file-selector-button{-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;align-items:center;cursor:pointer;display:inline-flex;justify-content:center;text-align:center;touch-action:manipulation;-webkit-user-select:none;-moz-user-select:none;user-select:none;--button-border-width: var(--border-2);position:var(--vv-button-position);background:var(--vv-button-background);border-radius:var(--vv-button-border-radius);border-width:var(--button-border-width);border-style:var(--vv-button-border-style);border-color:var(--vv-button-border-color);color:var(--vv-button-color);font-family:var(--vv-button-font-family);font-weight:var(--vv-button-font-weight);gap:var(--vv-button-gap);line-height:var(--vv-button-line-height);padding-block:var(--vv-button-padding-block);padding-inline:var(--vv-button-padding-inline);text-shadow:var(--vv-button-text-shadow);transition:var(--vv-button-transition);will-change:var(--vv-button-will-change);min-width:var(--vv-button-min-width)}@media (prefers-reduced-motion: reduce){:where(.vv-button):where(a[href],button,input[type=button],input[type=submit],input[type=reset]),:where(.vv-button)::file-selector-button{transition:none}}:where(.vv-button)::file-selector-button{-webkit-margin-end:var(--vv-button-gap, 1ch);margin-inline-end:var(--vv-button-gap, 1ch)}:where(.vv-button__icon,.vv-button > :where(svg,[data-icon])){block-size:var(--vv-button-element-icon-block-size);inline-size:var(--vv-button-element-icon-inline-size);margin:var(--vv-button-element-icon-margin);stroke:var(--vv-button-element-icon-stroke);fill:var(--vv-button-element-icon-fill);flex-shrink:var(--vv-button-element-icon-flex-shrink);stroke-linecap:var(--vv-button-element-icon-stroke-linecap);stroke-linejoin:var(--vv-button-element-icon-stroke-linejoin)}:where(.vv-button__label){white-space:var(--vv-button-element-label-white-space);text-overflow:var(--vv-button-element-label-text-overflow);min-width:var(--vv-button-element-label-min-width);overflow:var(--vv-button-element-label-overflow)}:where(.vv-button--focus-visible,.vv-button.focus-visible,.vv-button:not(:active):not([disabled]):not([tabindex="-1"]:not([aria-disabled=true])):focus-visible){outline-offset:var(--vv-button-state-focus-visible-outline-offset);outline:var(--vv-button-state-focus-visible-outline)}:where(.vv-button--hover,.vv-button.hover,.vv-button:not([disabled]):hover){--vv-button-background: var(--vv-button-state-hover-background);--vv-button-border-color: var(--vv-button-state-hover-border-color)}:where(.vv-button--active,.vv-button.active,.vv-button:not([disabled]):active){--vv-button-background: var(--vv-button-state-active-background);--vv-button-border-color: var(--vv-button-state-active-border-color)}:where(.vv-button--selected,.vv-button.selected,.vv-button[aria-selected=true]){--vv-button-background: var(--vv-button-state-selected-background);--vv-button-border-color: var(--vv-button-state-selected-border-color)}:where(.vv-button--disabled,.vv-button.disabled,.vv-button[disabled],.vv-button[aria-disabled=true]){opacity:var(--vv-button-state-disabled-opacity);cursor:var(--vv-button-state-disabled-cursor)}:where(.vv-button--primary.vv-button){--vv-button-background: var(--vv-button-modifier-primary-background);--vv-button-border-color: var(--vv-button-modifier-primary-border-color);--vv-button-color: var(--vv-button-modifier-primary-color)}:where(.vv-button--primary.vv-button--focus-visible,.vv-button--primary.vv-button.focus-visible,.vv-button--primary.vv-button:not(:active):not([disabled]):not([tabindex="-1"]:not([aria-disabled=true])):focus-visible){outline:var(--vv-button-modifier-primary-state-focus-visible-outline)}:where(.vv-button--primary.vv-button--hover,.vv-button--primary.vv-button.hover,.vv-button--primary.vv-button:not([disabled]):hover){--vv-button-modifier-primary-background: var(--vv-button-modifier-primary-state-hover-background);--vv-button-modifier-primary-border-color: var(--vv-button-modifier-primary-state-hover-border-color)}:where(.vv-button--primary.vv-button--active,.vv-button--primary.vv-button.active,.vv-button--primary.vv-button:not([disabled]):active){--vv-button-modifier-primary-background: var(--vv-button-modifier-primary-state-active-background);--vv-button-modifier-primary-border-color: var(--vv-button-modifier-primary-state-active-border-color)}:where(.vv-button--primary.vv-button--selected,.vv-button--primary.vv-button.selected,.vv-button--primary.vv-button[aria-selected=true]){--vv-button-modifier-primary-background: var(--vv-button-modifier-primary-state-selected-background);--vv-button-modifier-primary-border-color: var(--vv-button-modifier-primary-state-selected-border-color)}:where(.vv-button--secondary.vv-button){--vv-button-background: var(--vv-button-modifier-secondary-background);--vv-button-border-style: var(--vv-button-modifier-secondary-border-style);--vv-button-border-color: var(--vv-button-modifier-secondary-border-color);--vv-button-color: var(--vv-button-modifier-secondary-color);--vv-button-text-shadow: var(--vv-button-modifier-secondary-text-shadow)}:where(.vv-button--secondary.vv-button--focus-visible,.vv-button--secondary.vv-button.focus-visible,.vv-button--secondary.vv-button:not(:active):not([disabled]):not([tabindex="-1"]:not([aria-disabled=true])):focus-visible){outline:var(--vv-button-modifier-secondary-state-focus-visible-outline)}:where(.vv-button--secondary.vv-button--hover,.vv-button--secondary.vv-button.hover,.vv-button--secondary.vv-button:not([disabled]):hover){--vv-button-modifier-secondary-background: var(--vv-button-modifier-secondary-state-hover-background)}:where(.vv-button--secondary.vv-button--active,.vv-button--secondary.vv-button.active,.vv-button--secondary.vv-button:not([disabled]):active){--vv-button-modifier-secondary-background: var(--vv-button-modifier-secondary-state-active-background)}:where(.vv-button--secondary.vv-button--selected,.vv-button--secondary.vv-button.selected,.vv-button--secondary.vv-button[aria-selected=true]){--vv-button-modifier-secondary-background: var(--vv-button-modifier-secondary-state-selected-background)}:where(.vv-button--danger.vv-button){--vv-button-background: var(--vv-button-modifier-danger-background);--vv-button-border-color: var(--vv-button-modifier-danger-border-color);--vv-button-color: var(--vv-button-modifier-danger-color)}:where(.vv-button--danger.vv-button--focus-visible,.vv-button--danger.vv-button.focus-visible,.vv-button--danger.vv-button:not(:active):not([disabled]):not([tabindex="-1"]:not([aria-disabled=true])):focus-visible){outline:var(--vv-button-modifier-danger-state-focus-visible-outline)}:where(.vv-button--danger.vv-button--hover,.vv-button--danger.vv-button.hover,.vv-button--danger.vv-button:not([disabled]):hover){--vv-button-modifier-danger-background: var(--vv-button-modifier-danger-state-hover-background);--vv-button-modifier-danger-border-color: var(--vv-button-modifier-danger-state-hover-border-color)}:where(.vv-button--danger.vv-button--active,.vv-button--danger.vv-button.active,.vv-button--danger.vv-button:not([disabled]):active){--vv-button-modifier-danger-background: var(--vv-button-modifier-danger-state-active-background);--vv-button-modifier-danger-border-color: var(--vv-button-modifier-danger-state-active-border-color)}:where(.vv-button--danger.vv-button--selected,.vv-button--danger.vv-button.selected,.vv-button--danger.vv-button[aria-selected=true]){--vv-button-modifier-danger-background: var(--vv-button-modifier-danger-state-selected-background);--vv-button-modifier-danger-border-color: var(--vv-button-modifier-danger-state-selected-border-color)}:where(.vv-button--ghost.vv-button){--vv-button-background: var(--vv-button-modifier-ghost-background);--vv-button-border-color: var(--vv-button-modifier-ghost-border-color);--vv-button-color: var(--vv-button-modifier-ghost-color);--vv-button-text-shadow: var(--vv-button-modifier-ghost-text-shadow)}:where(.vv-button--ghost.vv-button--focus-visible,.vv-button--ghost.vv-button.focus-visible,.vv-button--ghost.vv-button:not(:active):not([disabled]):not([tabindex="-1"]:not([aria-disabled=true])):focus-visible){outline:var(--vv-button-modifier-ghost-state-focus-visible-outline);outline-offset:var(--vv-button-modifier-ghost-state-focus-visible-outline-offset)}:where(.vv-button--ghost.vv-button--hover,.vv-button--ghost.vv-button.hover,.vv-button--ghost.vv-button:not([disabled]):hover){--vv-button-modifier-ghost-background: var(--vv-button-modifier-ghost-state-hover-background)}:where(.vv-button--ghost.vv-button--active,.vv-button--ghost.vv-button.active,.vv-button--ghost.vv-button:not([disabled]):active){--vv-button-modifier-ghost-background: var(--vv-button-modifier-ghost-state-active-background)}:where(.vv-button--ghost.vv-button--selected,.vv-button--ghost.vv-button.selected,.vv-button--ghost.vv-button[aria-selected=true]){--vv-button-modifier-ghost-background: var(--vv-button-modifier-ghost-state-selected-background)}:where(.vv-button--link.vv-button){--vv-button-background: var(--vv-button-modifier-link-background);--vv-button-border-color: var(--vv-button-modifier-link-border-color);border-width:var(--vv-button-modifier-link-border-width);--vv-button-border-radius: var(--vv-button-modifier-link-border-radius);padding:var(--vv-button-modifier-link-padding);--vv-button-color: var(--vv-button-modifier-link-color);--vv-button-text-shadow: var(--vv-button-modifier-link-text-shadow)}:where(.vv-button--link.vv-button--focus-visible,.vv-button--link.vv-button.focus-visible,.vv-button--link.vv-button:not(:active):not([disabled]):not([tabindex="-1"]:not([aria-disabled=true])):focus-visible){--vv-button-modifier-link-color: var(--vv-button-modifier-link-state-focus-visible-color);outline:var(--vv-button-modifier-link-state-focus-visible-outline)}:where(.vv-button--link.vv-button--hover,.vv-button--link.vv-button.hover,.vv-button--link.vv-button:not([disabled]):hover){-webkit-text-decoration:var(--vv-button-modifier-link-state-hover-text-decoration);text-decoration:var(--vv-button-modifier-link-state-hover-text-decoration);text-underline-offset:var(--vv-button-modifier-link-state-hover-text-underline-offset)}:where(.vv-button--static-light.vv-button){--vv-button-background: var(--vv-button-modifier-static-light-background);--vv-button-border-color: var(--vv-button-modifier-static-light-border-color);--vv-button-color: var(--vv-button-modifier-static-light-color);--vv-button-text-shadow: var(--vv-button-modifier-static-light-text-shadow)}:where(.vv-button--static-light.vv-button--focus-visible,.vv-button--static-light.vv-button.focus-visible,.vv-button--static-light.vv-button:not(:active):not([disabled]):not([tabindex="-1"]:not([aria-disabled=true])):focus-visible){outline:var(--vv-button-modifier-static-light-state-focus-visible-outline)}:where(.vv-button--static-light.vv-button--hover,.vv-button--static-light.vv-button.hover,.vv-button--static-light.vv-button:not([disabled]):hover){--vv-button-modifier-static-light-border-color: var(--vv-button-modifier-static-light-state-hover-border-color);--vv-button-modifier-static-light-background: var(--vv-button-modifier-static-light-state-hover-background)}:where(.vv-button--static-light.vv-button--active,.vv-button--static-light.vv-button.active,.vv-button--static-light.vv-button:not([disabled]):active){--vv-button-modifier-static-light-border-color: var(--vv-button-modifier-static-light-state-active-border-color);--vv-button-modifier-static-light-background: var(--vv-button-modifier-static-light-state-active-background)}:where(.vv-button--static-light.vv-button--selected,.vv-button--static-light.vv-button.selected,.vv-button--static-light.vv-button[aria-selected=true]){--vv-button-modifier-static-light-border-color: var(--vv-button-modifier-static-light-state-selected-border-color);--vv-button-modifier-static-light-background: var(--vv-button-modifier-static-light-state-selected-background)}:where(.vv-button--static-dark.vv-button){--vv-button-background: var(--vv-button-modifier-static-dark-background);--vv-button-border-color: var(--vv-button-modifier-static-dark-border-color);--vv-button-color: var(--vv-button-modifier-static-dark-color);--vv-button-text-shadow: var(--vv-button-modifier-static-dark-text-shadow)}:where(.vv-button--static-dark.vv-button--focus-visible,.vv-button--static-dark.vv-button.focus-visible,.vv-button--static-dark.vv-button:not(:active):not([disabled]):not([tabindex="-1"]:not([aria-disabled=true])):focus-visible){outline:var(--vv-button-modifier-static-dark-state-focus-visible-outline)}:where(.vv-button--static-dark.vv-button--hover,.vv-button--static-dark.vv-button.hover,.vv-button--static-dark.vv-button:not([disabled]):hover){--vv-button-modifier-static-dark-border-color: var(--vv-button-modifier-static-dark-state-hover-border-color);--vv-button-modifier-static-dark-background: var(--vv-button-modifier-static-dark-state-hover-background)}:where(.vv-button--static-dark.vv-button--active,.vv-button--static-dark.vv-button.active,.vv-button--static-dark.vv-button:not([disabled]):active){--vv-button-modifier-static-dark-border-color: var(--vv-button-modifier-static-dark-state-active-border-color);--vv-button-modifier-static-dark-background: var(--vv-button-modifier-static-dark-state-active-background)}:where(.vv-button--static-dark.vv-button--selected,.vv-button--static-dark.vv-button.selected,.vv-button--static-dark.vv-button[aria-selected=true]){--vv-button-modifier-static-dark-border-color: var(--vv-button-modifier-static-dark-state-selected-border-color);--vv-button-modifier-static-dark-background: var(--vv-button-modifier-static-dark-state-selected-background)}:where(.vv-button--action.vv-button){--button-border-width: var(--border);font-size:var(--vv-button-modifier-action-font-size);--vv-button-background: var(--vv-button-modifier-action-background);--vv-button-color: var(--vv-button-modifier-action-color);--vv-button-border-color: var(--vv-button-modifier-action-border-color);--vv-button-font-weight: var(--vv-button-modifier-action-font-weight);--vv-button-padding-inline: var(--vv-button-modifier-action-padding-inline);--vv-button-padding-block: var(--vv-button-modifier-action-padding-block);--vv-button-line-height: var(--vv-button-modifier-action-line-height);--vv-button-text-shadow: var(--vv-button-modifier-action-text-shadow)}:where(.vv-button--action .vv-button__icon,.vv-button--action > :where(svg,[data-icon])){margin-inline:var(--vv-button-modifier-action-element-icon-margin-inline);block-size:var(--vv-button-modifier-action-element-icon-block-size);inline-size:var(--vv-button-modifier-action-element-icon-inline-size)}:where(.vv-button--action.vv-button--focus-visible,.vv-button--action.vv-button.focus-visible,.vv-button--action.vv-button:not(:active):not([disabled]):not([tabindex="-1"]:not([aria-disabled=true])):focus-visible){outline:var(--vv-button-modifier-action-state-focus-visible-outline)}:where(.vv-button--action.vv-button--hover,.vv-button--action.vv-button.hover,.vv-button--action.vv-button:not([disabled]):hover){--vv-button-modifier-action-background: var(--vv-button-modifier-action-state-hover-background)}:where(.vv-button--action.vv-button--active,.vv-button--action.vv-button.active,.vv-button--action.vv-button:not([disabled]):active){--vv-button-modifier-action-background: var(--vv-button-modifier-action-state-active-background)}:where(.vv-button--action.vv-button--selected,.vv-button--action.vv-button.selected,.vv-button--action.vv-button[aria-selected=true]){--vv-button-modifier-action-color: var(--vv-button-modifier-action-state-selected-color);--vv-button-modifier-action-background: var(--vv-button-modifier-action-state-selected-background);--vv-button-modifier-action-border-color: var(--vv-button-modifier-action-state-selected-border-color)}:where(.vv-button--action-quiet.vv-button){--button-border-width: var(--border);font-size:var(--vv-button-modifier-action-quiet-font-size);--vv-button-background: var(--vv-button-modifier-action-quiet-background);--vv-button-color: var(--vv-button-modifier-action-quiet-color);--vv-button-border-color: var(--vv-button-modifier-action-quiet-border-color);--vv-button-font-weight: var(--vv-button-modifier-action-quiet-font-weight);--vv-button-padding-inline: var(--vv-button-modifier-action-quiet-padding-inline);--vv-button-padding-block: var(--vv-button-modifier-action-quiet-padding-block);--vv-button-line-height: var(--vv-button-modifier-action-quiet-line-height);--vv-button-text-shadow: var(--vv-button-modifier-action-quiet-text-shadow)}:where(.vv-button--action-quiet .vv-button__icon,.vv-button--action-quiet > :where(svg,[data-icon])){margin-inline:var(--vv-button-modifier-action-quiet-element-icon-margin-inline);block-size:var(--vv-button-modifier-action-quiet-element-icon-block-size);inline-size:var(--vv-button-modifier-action-quiet-element-icon-inline-size)}:where(.vv-button--action-quiet.vv-button--focus-visible,.vv-button--action-quiet.vv-button.focus-visible,.vv-button--action-quiet.vv-button:not(:active):not([disabled]):not([tabindex="-1"]:not([aria-disabled=true])):focus-visible){outline:var(--vv-button-modifier-action-quiet-state-focus-visible-outline);outline-offset:var(--vv-button-modifier-action-quiet-state-focus-visible-outline-offset)}:where(.vv-button--action-quiet.vv-button--hover,.vv-button--action-quiet.vv-button.hover,.vv-button--action-quiet.vv-button:not([disabled]):hover){--vv-button-modifier-action-quiet-background: var(--vv-button-modifier-action-quiet-state-hover-background);--vv-button-modifier-action-quiet-border-color: var(--vv-button-modifier-action-quiet-state-hover-border-color)}:where(.vv-button--action-quiet.vv-button--active,.vv-button--action-quiet.vv-button.active,.vv-button--action-quiet.vv-button:not([disabled]):active){--vv-button-modifier-action-quiet-background: var(--vv-button-modifier-action-quiet-state-active-background);--vv-button-modifier-action-quiet-border-color: var(--vv-button-modifier-action-quiet-state-active-border-color)}:where(.vv-button--action-quiet.vv-button--selected,.vv-button--action-quiet.vv-button.selected,.vv-button--action-quiet.vv-button[aria-selected=true]){--vv-button-modifier-action-quiet-color: var(--vv-button-modifier-action-quiet-state-selected-color);--vv-button-modifier-action-quiet-background: var(--vv-button-modifier-action-quiet-state-selected-background);--vv-button-modifier-action-quiet-border-color: var(--vv-button-modifier-action-quiet-state-selected-border-color)}:where(.vv-button--rounded.vv-button){--vv-button-border-radius: var(--vv-button-modifier-rounded-border-radius)}:where(.vv-button--rounded .vv-button__icon,.vv-button--rounded > :where(svg,[data-icon])){margin:var(--vv-button-modifier-rounded-element-icon-margin)}:where(.vv-button--block.vv-button){display:var(--vv-button-modifier-block-display);width:var(--vv-button-modifier-block-width);max-width:var(--vv-button-modifier-block-max-width)}:where(.vv-button--reverse .vv-button__label){order:var(--vv-button-modifier-reverse-element-label-order)}:where(.vv-button--column.vv-button){flex-direction:var(--vv-button-modifier-column-flex-direction);--vv-button-gap: var(--vv-button-modifier-column-gap)}:where(.vv-button--full-bleed.vv-button){--vv-button-min-width: var(--vv-button-modifier-full-bleed-min-width)}
package/dist/components/vv-card.css CHANGED
@@ -1 +1 @@
1
- :where(:host,:root,.theme){--vv-card-position: relative;--vv-card-display: flex;--vv-card-flex-direction: column;--vv-card-overflow: hidden;--vv-card-border-color: var(--color-surface-4);--vv-card-border-top-width: var(--border);--vv-card-border-right-width: var(--border);--vv-card-border-bottom-width: var(--border);--vv-card-border-left-width: var(--border);--vv-card-border-style: none;--vv-card-border-radius: var(--rounded-lg);--vv-card-margin: var(--spacing-0);--vv-card-background-color: var(--color-surface);--vv-card-box-shadow: var(--shadow-md);--vv-card-color: var(--color-word-2);--vv-card-backdrop-filter: none;--vv-card-element-header-overflow: hidden;--vv-card-element-header-font-size: var(--text-md);--vv-card-element-header-padding: var(--spacing-md);--vv-card-element-header-background-color: var(--color-surface-1);--vv-card-element-header-border-bottom: var(--border) solid var(--color-surface-4);--vv-card-element-picture-display: block;--vv-card-element-picture-width: 100%;--vv-card-element-picture-height: auto;--vv-card-element-picture-object-fit: cover;--vv-card-element-picture-object-position: center;--vv-card-element-content-padding: var(--spacing-md);--vv-card-element-content-line-height: var(--leading-normal);--vv-card-element-content-flex-grow: 1;--vv-card-element-content-min-height: 0;--vv-card-element-content-overflow: auto;--vv-card-element-footer-border-top: var(--border) solid var(--color-surface-4);--vv-card-element-footer-padding: var(--spacing-md);--vv-card-modifier-glass-background-color: hsla(var(--color-surface-hue) var(--color-surface-saturation) var(--color-surface-lightness)/60%);--vv-card-modifier-glass-backdrop-filter: var(--blur-md);--vv-card-modifier-glass-element-header-background-color: hsla(var(--color-surface-hue) var(--color-surface-saturation) var(--color-surface-lightness)/30%);--vv-card-modifier-glass-element-footer-background-color: hsla(var(--color-surface-hue) var(--color-surface-saturation) var(--color-surface-lightness)/30%)}:where(.vv-card){position:var(--vv-card-position);display:var(--vv-card-display);flex-direction:var(--vv-card-flex-direction);overflow:var(--vv-card-overflow);border-color:var(--vv-card-border-color);border-top-width:var(--vv-card-border-top-width);border-right-width:var(--vv-card-border-right-width);border-bottom-width:var(--vv-card-border-bottom-width);border-left-width:var(--vv-card-border-left-width);border-style:var(--vv-card-border-style);border-radius:var(--vv-card-border-radius);margin:var(--vv-card-margin);background-color:var(--vv-card-background-color);box-shadow:var(--vv-card-box-shadow);color:var(--vv-card-color);-webkit-backdrop-filter:var(--vv-card-backdrop-filter);backdrop-filter:var(--vv-card-backdrop-filter)}:where(.vv-card__header,.vv-card > header){overflow:var(--vv-card-element-header-overflow);font-size:var(--vv-card-element-header-font-size);padding:var(--vv-card-element-header-padding);background-color:var(--vv-card-element-header-background-color);border-bottom:var(--vv-card-element-header-border-bottom)}:where(.vv-card__picture,.vv-card > picture > img){display:var(--vv-card-element-picture-display);width:var(--vv-card-element-picture-width);height:var(--vv-card-element-picture-height);-o-object-fit:var(--vv-card-element-picture-object-fit);object-fit:var(--vv-card-element-picture-object-fit);-o-object-position:var(--vv-card-element-picture-object-position);object-position:var(--vv-card-element-picture-object-position)}:where(.vv-card__content){padding:var(--vv-card-element-content-padding);line-height:var(--vv-card-element-content-line-height);flex-grow:var(--vv-card-element-content-flex-grow);min-height:var(--vv-card-element-content-min-height);overflow:var(--vv-card-element-content-overflow)}:where(.vv-card__footer,.vv-card > footer){border-top:var(--vv-card-element-footer-border-top);padding:var(--vv-card-element-footer-padding)}:where(.vv-card--glass.vv-card){--vv-card-background-color: var(--vv-card-modifier-glass-background-color);--vv-card-backdrop-filter: var(--vv-card-modifier-glass-backdrop-filter)}:where(.vv-card--glass .vv-card__header,.vv-card--glass > header){background-color:var(--vv-card-modifier-glass-element-header-background-color)}:where(.vv-card--glass .vv-card__footer,.vv-card--glass > footer){background-color:var(--vv-card-modifier-glass-element-footer-background-color)}
1
+ :where(:host,:root,.theme){--vv-card-position: relative;--vv-card-display: flex;--vv-card-flex-direction: column;--vv-card-overflow: hidden;--vv-card-border-color: var(--color-surface-4);--vv-card-border-top-width: var(--border);--vv-card-border-right-width: var(--border);--vv-card-border-bottom-width: var(--border);--vv-card-border-left-width: var(--border);--vv-card-border-style: none;--vv-card-border-radius: var(--rounded-lg);--vv-card-margin: var(--spacing-0);--vv-card-background-color: var(--color-surface);--vv-card-box-shadow: var(--shadow-md);--vv-card-color: var(--color-word-2);--vv-card-backdrop-filter: none;--vv-card-element-header-overflow: hidden;--vv-card-element-header-padding: var(--spacing-md);--vv-card-element-header-background-color: var(--color-surface-1);--vv-card-element-header-border-bottom: var(--border) solid var(--color-surface-4);--vv-card-element-picture-display: block;--vv-card-element-picture-width: 100%;--vv-card-element-picture-height: auto;--vv-card-element-picture-object-fit: cover;--vv-card-element-picture-object-position: center;--vv-card-element-content-padding: var(--spacing-md);--vv-card-element-content-line-height: var(--leading-normal);--vv-card-element-content-flex-grow: 1;--vv-card-element-content-min-height: 0;--vv-card-element-content-overflow: auto;--vv-card-element-footer-border-top: var(--border) solid var(--color-surface-4);--vv-card-element-footer-padding: var(--spacing-md);--vv-card-modifier-glass-background-color: hsla(var(--color-surface-hue) var(--color-surface-saturation) var(--color-surface-lightness)/60%);--vv-card-modifier-glass-backdrop-filter: var(--blur-md);--vv-card-modifier-glass-element-header-background-color: hsla(var(--color-surface-hue) var(--color-surface-saturation) var(--color-surface-lightness)/30%);--vv-card-modifier-glass-element-footer-background-color: hsla(var(--color-surface-hue) var(--color-surface-saturation) var(--color-surface-lightness)/30%)}:where(.vv-card){position:var(--vv-card-position);display:var(--vv-card-display);flex-direction:var(--vv-card-flex-direction);overflow:var(--vv-card-overflow);border-color:var(--vv-card-border-color);border-top-width:var(--vv-card-border-top-width);border-right-width:var(--vv-card-border-right-width);border-bottom-width:var(--vv-card-border-bottom-width);border-left-width:var(--vv-card-border-left-width);border-style:var(--vv-card-border-style);border-radius:var(--vv-card-border-radius);margin:var(--vv-card-margin);background-color:var(--vv-card-background-color);box-shadow:var(--vv-card-box-shadow);color:var(--vv-card-color);-webkit-backdrop-filter:var(--vv-card-backdrop-filter);backdrop-filter:var(--vv-card-backdrop-filter)}:where(.vv-card__header,.vv-card > header){overflow:var(--vv-card-element-header-overflow);padding:var(--vv-card-element-header-padding);background-color:var(--vv-card-element-header-background-color);border-bottom:var(--vv-card-element-header-border-bottom)}:where(.vv-card__picture,.vv-card > picture > img){display:var(--vv-card-element-picture-display);width:var(--vv-card-element-picture-width);height:var(--vv-card-element-picture-height);-o-object-fit:var(--vv-card-element-picture-object-fit);object-fit:var(--vv-card-element-picture-object-fit);-o-object-position:var(--vv-card-element-picture-object-position);object-position:var(--vv-card-element-picture-object-position)}:where(.vv-card__content){padding:var(--vv-card-element-content-padding);line-height:var(--vv-card-element-content-line-height);flex-grow:var(--vv-card-element-content-flex-grow);min-height:var(--vv-card-element-content-min-height);overflow:var(--vv-card-element-content-overflow)}:where(.vv-card__footer,.vv-card > footer){border-top:var(--vv-card-element-footer-border-top);padding:var(--vv-card-element-footer-padding)}:where(.vv-card--glass.vv-card){--vv-card-background-color: var(--vv-card-modifier-glass-background-color);--vv-card-backdrop-filter: var(--vv-card-modifier-glass-backdrop-filter)}:where(.vv-card--glass .vv-card__header,.vv-card--glass > header){background-color:var(--vv-card-modifier-glass-element-header-background-color)}:where(.vv-card--glass .vv-card__footer,.vv-card--glass > footer){background-color:var(--vv-card-modifier-glass-element-footer-background-color)}
package/dist/components/vv-input-checkbox-group.css CHANGED
@@ -1 +1 @@
1
- :where(:host,:root,.theme){--vv-input-checkbox-group-display: var(--input-display);--vv-input-checkbox-group-flex: var(--input-flex);--vv-input-checkbox-group-flex-direction: var(--input-flex-direction);--vv-input-checkbox-group-element-legend-display: var(--input-label-display);--vv-input-checkbox-group-element-legend-font-size: var(--input-label-font-size);--vv-input-checkbox-group-element-legend-color: var(--input-label-color);--vv-input-checkbox-group-element-legend-margin: 0 0 var(--input-label-gap) 0;--vv-input-checkbox-group-element-legend-white-space: var(--input-label-white-space);--vv-input-checkbox-group-element-legend-text-overflow: var(--input-label-text-overflow);--vv-input-checkbox-group-element-legend-overflow: var(--input-label-overflow);--vv-input-checkbox-group-element-legend-max-width: var(--input-label-max-width);--vv-input-checkbox-group-element-wrapper-position: relative;--vv-input-checkbox-group-element-wrapper-display: flex;--vv-input-checkbox-group-element-wrapper-flex-direction: column;--vv-input-checkbox-group-element-wrapper-flex-wrap: wrap;--vv-input-checkbox-group-element-hint-display: var(--input-hint-display);--vv-input-checkbox-group-element-hint-font-size: var(--input-hint-font-size);--vv-input-checkbox-group-element-hint-color: var(--input-hint-color);--vv-input-checkbox-group-element-hint-padding-top: var(--input-hint-gap);--vv-input-checkbox-group-element-hint-white-space: var(--input-hint-white-space);--vv-input-checkbox-group-element-hint-text-overflow: var(--input-hint-text-overflow);--vv-input-checkbox-group-element-hint-overflow: var(--input-hint-overflow);--vv-input-checkbox-group-element-hint-max-width: var(--input-hint-max-width);--vv-input-checkbox-group-element-hint-margin-top: calc(var(--input-gap) * -1);--vv-input-checkbox-group-element-hint-margin-bottom: var(--input-gap);--vv-input-checkbox-group-modifier-horizontal-element-wrapper-flex-direction: row;--vv-input-checkbox-group-modifier-valid-element-hint-color: var(--input-valid-color);--vv-input-checkbox-group-modifier-invalid-element-hint-color: var(--input-invalid-color)}:where(.vv-input-checkbox-group){display:var(--vv-input-checkbox-group-display);flex:var(--vv-input-checkbox-group-flex);flex-direction:var(--vv-input-checkbox-group-flex-direction)}:where(.vv-input-checkbox-group__legend,.vv-input-checkbox-group > legend){display:var(--vv-input-checkbox-group-element-legend-display);font-size:var(--vv-input-checkbox-group-element-legend-font-size);color:var(--vv-input-checkbox-group-element-legend-color);margin:var(--vv-input-checkbox-group-element-legend-margin);white-space:var(--vv-input-checkbox-group-element-legend-white-space);text-overflow:var(--vv-input-checkbox-group-element-legend-text-overflow);overflow:var(--vv-input-checkbox-group-element-legend-overflow);max-width:var(--vv-input-checkbox-group-element-legend-max-width)}:where(.vv-input-checkbox-group__wrapper){position:var(--vv-input-checkbox-group-element-wrapper-position);display:var(--vv-input-checkbox-group-element-wrapper-display);flex-direction:var(--vv-input-checkbox-group-element-wrapper-flex-direction);flex-wrap:var(--vv-input-checkbox-group-element-wrapper-flex-wrap)}:where(.vv-input-checkbox-group__hint,.vv-input-checkbox-group > small){display:var(--vv-input-checkbox-group-element-hint-display);font-size:var(--vv-input-checkbox-group-element-hint-font-size);color:var(--vv-input-checkbox-group-element-hint-color);padding-top:var(--vv-input-checkbox-group-element-hint-padding-top);white-space:var(--vv-input-checkbox-group-element-hint-white-space);text-overflow:var(--vv-input-checkbox-group-element-hint-text-overflow);overflow:var(--vv-input-checkbox-group-element-hint-overflow);max-width:var(--vv-input-checkbox-group-element-hint-max-width);margin-top:var(--vv-input-checkbox-group-element-hint-margin-top);margin-bottom:var(--vv-input-checkbox-group-element-hint-margin-bottom)}:where(.vv-input-checkbox-group--horizontal .vv-input-checkbox-group__wrapper){flex-direction:var(--vv-input-checkbox-group-modifier-horizontal-element-wrapper-flex-direction)}:where(.vv-input-checkbox-group--valid .vv-input-checkbox-group__hint,.vv-input-checkbox-group--valid > small){color:var(--vv-input-checkbox-group-modifier-valid-element-hint-color)}:where(.vv-input-checkbox-group--invalid .vv-input-checkbox-group__hint,.vv-input-checkbox-group--invalid > small){color:var(--vv-input-checkbox-group-modifier-invalid-element-hint-color)}
1
+ :where(:host,:root,.theme){--vv-input-checkbox-group-display: var(--input-display);--vv-input-checkbox-group-flex: var(--input-flex);--vv-input-checkbox-group-flex-direction: var(--input-flex-direction);--vv-input-checkbox-group-min-width: max-content;--vv-input-checkbox-group-element-legend-display: var(--input-label-display);--vv-input-checkbox-group-element-legend-font-size: var(--input-label-font-size);--vv-input-checkbox-group-element-legend-color: var(--input-label-color);--vv-input-checkbox-group-element-legend-margin: 0 0 var(--input-label-gap) 0;--vv-input-checkbox-group-element-legend-white-space: var(--input-label-white-space);--vv-input-checkbox-group-element-legend-text-overflow: var(--input-label-text-overflow);--vv-input-checkbox-group-element-legend-overflow: var(--input-label-overflow);--vv-input-checkbox-group-element-legend-max-width: var(--input-label-max-width);--vv-input-checkbox-group-element-wrapper-position: relative;--vv-input-checkbox-group-element-wrapper-display: flex;--vv-input-checkbox-group-element-wrapper-flex-direction: column;--vv-input-checkbox-group-element-wrapper-flex-wrap: wrap;--vv-input-checkbox-group-element-hint-display: var(--input-hint-display);--vv-input-checkbox-group-element-hint-font-size: var(--input-hint-font-size);--vv-input-checkbox-group-element-hint-color: var(--input-hint-color);--vv-input-checkbox-group-element-hint-padding-top: var(--input-hint-gap);--vv-input-checkbox-group-element-hint-white-space: var(--input-hint-white-space);--vv-input-checkbox-group-element-hint-text-overflow: var(--input-hint-text-overflow);--vv-input-checkbox-group-element-hint-overflow: var(--input-hint-overflow);--vv-input-checkbox-group-element-hint-max-width: var(--input-hint-max-width);--vv-input-checkbox-group-element-hint-margin-top: calc(var(--input-gap) * -1);--vv-input-checkbox-group-element-hint-margin-bottom: var(--input-gap);--vv-input-checkbox-group-modifier-horizontal-element-wrapper-flex-direction: row;--vv-input-checkbox-group-modifier-valid-element-hint-color: var(--input-valid-color);--vv-input-checkbox-group-modifier-invalid-element-hint-color: var(--input-invalid-color)}:where(.vv-input-checkbox-group){display:var(--vv-input-checkbox-group-display);flex:var(--vv-input-checkbox-group-flex);flex-direction:var(--vv-input-checkbox-group-flex-direction);min-width:var(--vv-input-checkbox-group-min-width)}:where(.vv-input-checkbox-group__legend,.vv-input-checkbox-group > legend){display:var(--vv-input-checkbox-group-element-legend-display);font-size:var(--vv-input-checkbox-group-element-legend-font-size);color:var(--vv-input-checkbox-group-element-legend-color);margin:var(--vv-input-checkbox-group-element-legend-margin);white-space:var(--vv-input-checkbox-group-element-legend-white-space);text-overflow:var(--vv-input-checkbox-group-element-legend-text-overflow);overflow:var(--vv-input-checkbox-group-element-legend-overflow);max-width:var(--vv-input-checkbox-group-element-legend-max-width)}:where(.vv-input-checkbox-group__wrapper){position:var(--vv-input-checkbox-group-element-wrapper-position);display:var(--vv-input-checkbox-group-element-wrapper-display);flex-direction:var(--vv-input-checkbox-group-element-wrapper-flex-direction);flex-wrap:var(--vv-input-checkbox-group-element-wrapper-flex-wrap)}:where(.vv-input-checkbox-group__hint,.vv-input-checkbox-group > small){display:var(--vv-input-checkbox-group-element-hint-display);font-size:var(--vv-input-checkbox-group-element-hint-font-size);color:var(--vv-input-checkbox-group-element-hint-color);padding-top:var(--vv-input-checkbox-group-element-hint-padding-top);white-space:var(--vv-input-checkbox-group-element-hint-white-space);text-overflow:var(--vv-input-checkbox-group-element-hint-text-overflow);overflow:var(--vv-input-checkbox-group-element-hint-overflow);max-width:var(--vv-input-checkbox-group-element-hint-max-width);margin-top:var(--vv-input-checkbox-group-element-hint-margin-top);margin-bottom:var(--vv-input-checkbox-group-element-hint-margin-bottom)}:where(.vv-input-checkbox-group--horizontal .vv-input-checkbox-group__wrapper){flex-direction:var(--vv-input-checkbox-group-modifier-horizontal-element-wrapper-flex-direction)}:where(.vv-input-checkbox-group--valid .vv-input-checkbox-group__hint,.vv-input-checkbox-group--valid > small){color:var(--vv-input-checkbox-group-modifier-valid-element-hint-color)}:where(.vv-input-checkbox-group--invalid .vv-input-checkbox-group__hint,.vv-input-checkbox-group--invalid > small){color:var(--vv-input-checkbox-group-modifier-invalid-element-hint-color)}
package/dist/components/vv-input-radio-group.css CHANGED
@@ -1 +1 @@
1
- :where(:host,:root,.theme){--vv-input-radio-group-display: var(--input-display);--vv-input-radio-group-flex: var(--input-flex);--vv-input-radio-group-flex-direction: var(--input-flex-direction);--vv-input-radio-group-element-legend-display: var(--input-label-display);--vv-input-radio-group-element-legend-font-size: var(--input-label-font-size);--vv-input-radio-group-element-legend-color: var(--input-label-color);--vv-input-radio-group-element-legend-margin: 0 0 var(--input-label-gap) 0;--vv-input-radio-group-element-legend-white-space: var(--input-label-white-space);--vv-input-radio-group-element-legend-text-overflow: var(--input-label-text-overflow);--vv-input-radio-group-element-legend-overflow: var(--input-label-overflow);--vv-input-radio-group-element-legend-max-width: var(--input-label-max-width);--vv-input-radio-group-element-wrapper-position: relative;--vv-input-radio-group-element-wrapper-display: flex;--vv-input-radio-group-element-wrapper-flex-direction: column;--vv-input-radio-group-element-wrapper-flex-wrap: wrap;--vv-input-radio-group-element-hint-display: var(--input-hint-display);--vv-input-radio-group-element-hint-font-size: var(--input-hint-font-size);--vv-input-radio-group-element-hint-color: var(--input-hint-color);--vv-input-radio-group-element-hint-padding-top: var(--input-hint-gap);--vv-input-radio-group-element-hint-white-space: var(--input-hint-white-space);--vv-input-radio-group-element-hint-text-overflow: var(--input-hint-text-overflow);--vv-input-radio-group-element-hint-overflow: var(--input-hint-overflow);--vv-input-radio-group-element-hint-max-width: var(--input-hint-max-width);--vv-input-radio-group-element-hint-margin-top: calc(var(--input-gap) * -1);--vv-input-radio-group-element-hint-margin-bottom: var(--input-gap);--vv-input-radio-group-modifier-horizontal-element-wrapper-flex-direction: row;--vv-input-radio-group-modifier-valid-element-hint-color: var(--input-valid-color);--vv-input-radio-group-modifier-invalid-element-hint-color: var(--input-invalid-color)}:where(.vv-input-radio-group){display:var(--vv-input-radio-group-display);flex:var(--vv-input-radio-group-flex);flex-direction:var(--vv-input-radio-group-flex-direction)}:where(.vv-input-radio-group__legend,.vv-input-radio-group > legend){display:var(--vv-input-radio-group-element-legend-display);font-size:var(--vv-input-radio-group-element-legend-font-size);color:var(--vv-input-radio-group-element-legend-color);margin:var(--vv-input-radio-group-element-legend-margin);white-space:var(--vv-input-radio-group-element-legend-white-space);text-overflow:var(--vv-input-radio-group-element-legend-text-overflow);overflow:var(--vv-input-radio-group-element-legend-overflow);max-width:var(--vv-input-radio-group-element-legend-max-width)}:where(.vv-input-radio-group__wrapper){position:var(--vv-input-radio-group-element-wrapper-position);display:var(--vv-input-radio-group-element-wrapper-display);flex-direction:var(--vv-input-radio-group-element-wrapper-flex-direction);flex-wrap:var(--vv-input-radio-group-element-wrapper-flex-wrap)}:where(.vv-input-radio-group__hint,.vv-input-radio-group > small){display:var(--vv-input-radio-group-element-hint-display);font-size:var(--vv-input-radio-group-element-hint-font-size);color:var(--vv-input-radio-group-element-hint-color);padding-top:var(--vv-input-radio-group-element-hint-padding-top);white-space:var(--vv-input-radio-group-element-hint-white-space);text-overflow:var(--vv-input-radio-group-element-hint-text-overflow);overflow:var(--vv-input-radio-group-element-hint-overflow);max-width:var(--vv-input-radio-group-element-hint-max-width);margin-top:var(--vv-input-radio-group-element-hint-margin-top);margin-bottom:var(--vv-input-radio-group-element-hint-margin-bottom)}:where(.vv-input-radio-group--horizontal .vv-input-radio-group__wrapper){flex-direction:var(--vv-input-radio-group-modifier-horizontal-element-wrapper-flex-direction)}:where(.vv-input-radio-group--valid .vv-input-radio-group__hint,.vv-input-radio-group--valid > small){color:var(--vv-input-radio-group-modifier-valid-element-hint-color)}:where(.vv-input-radio-group--invalid .vv-input-radio-group__hint,.vv-input-radio-group--invalid > small){color:var(--vv-input-radio-group-modifier-invalid-element-hint-color)}
1
+ :where(:host,:root,.theme){--vv-input-radio-group-display: var(--input-display);--vv-input-radio-group-flex: var(--input-flex);--vv-input-radio-group-flex-direction: var(--input-flex-direction);--vv-input-radio-group-min-width: max-content;--vv-input-radio-group-element-legend-display: var(--input-label-display);--vv-input-radio-group-element-legend-font-size: var(--input-label-font-size);--vv-input-radio-group-element-legend-color: var(--input-label-color);--vv-input-radio-group-element-legend-margin: 0 0 var(--input-label-gap) 0;--vv-input-radio-group-element-legend-white-space: var(--input-label-white-space);--vv-input-radio-group-element-legend-text-overflow: var(--input-label-text-overflow);--vv-input-radio-group-element-legend-overflow: var(--input-label-overflow);--vv-input-radio-group-element-legend-max-width: var(--input-label-max-width);--vv-input-radio-group-element-wrapper-position: relative;--vv-input-radio-group-element-wrapper-display: flex;--vv-input-radio-group-element-wrapper-flex-direction: column;--vv-input-radio-group-element-wrapper-flex-wrap: wrap;--vv-input-radio-group-element-hint-display: var(--input-hint-display);--vv-input-radio-group-element-hint-font-size: var(--input-hint-font-size);--vv-input-radio-group-element-hint-color: var(--input-hint-color);--vv-input-radio-group-element-hint-padding-top: var(--input-hint-gap);--vv-input-radio-group-element-hint-white-space: var(--input-hint-white-space);--vv-input-radio-group-element-hint-text-overflow: var(--input-hint-text-overflow);--vv-input-radio-group-element-hint-overflow: var(--input-hint-overflow);--vv-input-radio-group-element-hint-max-width: var(--input-hint-max-width);--vv-input-radio-group-element-hint-margin-top: calc(var(--input-gap) * -1);--vv-input-radio-group-element-hint-margin-bottom: var(--input-gap);--vv-input-radio-group-modifier-horizontal-element-wrapper-flex-direction: row;--vv-input-radio-group-modifier-valid-element-hint-color: var(--input-valid-color);--vv-input-radio-group-modifier-invalid-element-hint-color: var(--input-invalid-color)}:where(.vv-input-radio-group){display:var(--vv-input-radio-group-display);flex:var(--vv-input-radio-group-flex);flex-direction:var(--vv-input-radio-group-flex-direction);min-width:var(--vv-input-radio-group-min-width)}:where(.vv-input-radio-group__legend,.vv-input-radio-group > legend){display:var(--vv-input-radio-group-element-legend-display);font-size:var(--vv-input-radio-group-element-legend-font-size);color:var(--vv-input-radio-group-element-legend-color);margin:var(--vv-input-radio-group-element-legend-margin);white-space:var(--vv-input-radio-group-element-legend-white-space);text-overflow:var(--vv-input-radio-group-element-legend-text-overflow);overflow:var(--vv-input-radio-group-element-legend-overflow);max-width:var(--vv-input-radio-group-element-legend-max-width)}:where(.vv-input-radio-group__wrapper){position:var(--vv-input-radio-group-element-wrapper-position);display:var(--vv-input-radio-group-element-wrapper-display);flex-direction:var(--vv-input-radio-group-element-wrapper-flex-direction);flex-wrap:var(--vv-input-radio-group-element-wrapper-flex-wrap)}:where(.vv-input-radio-group__hint,.vv-input-radio-group > small){display:var(--vv-input-radio-group-element-hint-display);font-size:var(--vv-input-radio-group-element-hint-font-size);color:var(--vv-input-radio-group-element-hint-color);padding-top:var(--vv-input-radio-group-element-hint-padding-top);white-space:var(--vv-input-radio-group-element-hint-white-space);text-overflow:var(--vv-input-radio-group-element-hint-text-overflow);overflow:var(--vv-input-radio-group-element-hint-overflow);max-width:var(--vv-input-radio-group-element-hint-max-width);margin-top:var(--vv-input-radio-group-element-hint-margin-top);margin-bottom:var(--vv-input-radio-group-element-hint-margin-bottom)}:where(.vv-input-radio-group--horizontal .vv-input-radio-group__wrapper){flex-direction:var(--vv-input-radio-group-modifier-horizontal-element-wrapper-flex-direction)}:where(.vv-input-radio-group--valid .vv-input-radio-group__hint,.vv-input-radio-group--valid > small){color:var(--vv-input-radio-group-modifier-valid-element-hint-color)}:where(.vv-input-radio-group--invalid .vv-input-radio-group__hint,.vv-input-radio-group--invalid > small){color:var(--vv-input-radio-group-modifier-invalid-element-hint-color)}
package/dist/components/vv-tooltip.css CHANGED
@@ -1 +1 @@
1
- :where(:host,:root,.theme){--vv-tooltip-position: relative;--vv-tooltip-display: inline-flex;--vv-tooltip-align-items: center;--vv-tooltip-element-content-opacity: 0;--vv-tooltip-element-content-position: absolute;--vv-tooltip-element-content-z-index: var(--z-tooltip);--vv-tooltip-element-content-display: block;--vv-tooltip-element-content-min-width: var(--spacing-160);--vv-tooltip-element-content-border-radius: var(--rounded-md);--vv-tooltip-element-content-border-width: 2px;--vv-tooltip-element-content-border-style: solid;--vv-tooltip-element-content-border-color: var(--color-gray-darken-4);--vv-tooltip-element-content-padding: var(--spacing-4) var(--spacing-sm);--vv-tooltip-element-content-margin: 0 0 0 var(--spacing-xs);--vv-tooltip-element-content-background: var(--color-gray-darken-4);--vv-tooltip-element-content-font-size: var(--text-12);--vv-tooltip-element-content-font-weight: var(--font-normal);--vv-tooltip-element-content-color: var(--color-gray-lighten-5);--vv-tooltip-element-content-text-align: center;--vv-tooltip-element-content-inset-inline: 100% auto;--vv-tooltip-element-content-inset-block: auto;--vv-tooltip-element-content-box-shadow: var(--shadow-md);--vv-tooltip-element-content-pseudo-after-position: absolute;--vv-tooltip-element-content-pseudo-after-z-index: -1;--vv-tooltip-element-content-pseudo-after-inset-inline: -10% auto;--vv-tooltip-element-content-pseudo-after-inset-block: 50% auto;--vv-tooltip-element-content-pseudo-after-transform: translateY(-50%);--vv-tooltip-element-content-pseudo-after-border: 10px solid var(--color-gray-darken-4);--vv-tooltip-element-content-pseudo-after-border-color: transparent var(--color-gray-darken-4) transparent transparent;--vv-tooltip-modifier-top-element-content-margin: 0 0 var(--spacing-xs) 0;--vv-tooltip-modifier-top-element-content-inset-inline: auto;--vv-tooltip-modifier-top-element-content-inset-block: auto 100%;--vv-tooltip-modifier-top-element-content-pseudo-after-position: absolute;--vv-tooltip-modifier-top-element-content-pseudo-after-z-index: -1;--vv-tooltip-modifier-top-element-content-pseudo-after-inset-inline: 45% auto;--vv-tooltip-modifier-top-element-content-pseudo-after-inset-block: 130% auto;--vv-tooltip-modifier-top-element-content-pseudo-after-border: 10px solid var(--color-gray-darken-4);--vv-tooltip-modifier-top-element-content-pseudo-after-border-color: var(--color-gray-darken-4) transparent transparent;--vv-tooltip-modifier-right-element-content-margin: 0 0 0 var(--spacing-xs);--vv-tooltip-modifier-right-element-content-inset-inline: 100% auto;--vv-tooltip-modifier-right-element-content-inset-block: auto;--vv-tooltip-modifier-right-element-content-pseudo-after-position: absolute;--vv-tooltip-modifier-right-element-content-pseudo-after-z-index: -1;--vv-tooltip-modifier-right-element-content-pseudo-after-inset-inline: -10% auto;--vv-tooltip-modifier-right-element-content-pseudo-after-inset-block: 50% auto;--vv-tooltip-modifier-right-element-content-pseudo-after-transform: translateY(-50%);--vv-tooltip-modifier-right-element-content-pseudo-after-border: 10px solid var(--color-gray-darken-4);--vv-tooltip-modifier-right-element-content-pseudo-after-border-color: transparent var(--color-gray-darken-4) transparent transparent;--vv-tooltip-modifier-bottom-element-content-margin: var(--spacing-xs) 0 0 0;--vv-tooltip-modifier-bottom-element-content-inset-inline: auto;--vv-tooltip-modifier-bottom-element-content-inset-block: 100% auto;--vv-tooltip-modifier-bottom-element-content-pseudo-after-position: absolute;--vv-tooltip-modifier-bottom-element-content-pseudo-after-z-index: -1;--vv-tooltip-modifier-bottom-element-content-pseudo-after-inset-inline: 45% auto;--vv-tooltip-modifier-bottom-element-content-pseudo-after-inset-block: auto 50%;--vv-tooltip-modifier-bottom-element-content-pseudo-after-border: 10px solid var(--color-gray-darken-4);--vv-tooltip-modifier-bottom-element-content-pseudo-after-border-color: transparent transparent var(--color-gray-darken-4) transparent;--vv-tooltip-modifier-left-element-content-margin: 0 var(--spacing-xs) 0 0;--vv-tooltip-modifier-left-element-content-inset-inline: auto 100%;--vv-tooltip-modifier-left-element-content-inset-block: auto;--vv-tooltip-modifier-left-element-content-pseudo-after-position: absolute;--vv-tooltip-modifier-left-element-content-pseudo-after-z-index: -1;--vv-tooltip-modifier-left-element-content-pseudo-after-inset-inline: auto -10%;--vv-tooltip-modifier-left-element-content-pseudo-after-inset-block: 50% auto;--vv-tooltip-modifier-left-element-content-pseudo-after-transform: translateY(-50%);--vv-tooltip-modifier-left-element-content-pseudo-after-border: 10px solid var(--color-gray-darken-4);--vv-tooltip-modifier-left-element-content-pseudo-after-border-color: transparent transparent transparent var(--color-gray-darken-4);--vv-tooltip-state-hover-element-content-opacity: 1;--vv-tooltip-state-hover-element-content-will-change: opacity;--vv-tooltip-state-hover-element-content-transition: opacity .3s ease-in-out}:where(.vv-tooltip){position:var(--vv-tooltip-position);display:var(--vv-tooltip-display);align-items:var(--vv-tooltip-align-items)}:where(.vv-tooltip__content){opacity:var(--vv-tooltip-element-content-opacity);position:var(--vv-tooltip-element-content-position);z-index:var(--vv-tooltip-element-content-z-index);display:var(--vv-tooltip-element-content-display);min-width:var(--vv-tooltip-element-content-min-width);border-radius:var(--vv-tooltip-element-content-border-radius);border-width:var(--vv-tooltip-element-content-border-width);border-style:var(--vv-tooltip-element-content-border-style);border-color:var(--vv-tooltip-element-content-border-color);padding:var(--vv-tooltip-element-content-padding);margin:var(--vv-tooltip-element-content-margin);background:var(--vv-tooltip-element-content-background);font-size:var(--vv-tooltip-element-content-font-size);font-weight:var(--vv-tooltip-element-content-font-weight);color:var(--vv-tooltip-element-content-color);text-align:var(--vv-tooltip-element-content-text-align);inset-inline:var(--vv-tooltip-element-content-inset-inline);inset-block:var(--vv-tooltip-element-content-inset-block);box-shadow:var(--vv-tooltip-element-content-box-shadow)}:where(.vv-tooltip__content):after{content:"";position:var(--vv-tooltip-element-content-pseudo-after-position);z-index:var(--vv-tooltip-element-content-pseudo-after-z-index);inset-inline:var(--vv-tooltip-element-content-pseudo-after-inset-inline);inset-block:var(--vv-tooltip-element-content-pseudo-after-inset-block);transform:var(--vv-tooltip-element-content-pseudo-after-transform);border:var(--vv-tooltip-element-content-pseudo-after-border);border-color:var(--vv-tooltip-element-content-pseudo-after-border-color)}:where(.vv-tooltip--hover .vv-tooltip__content,.vv-tooltip.hover .vv-tooltip__content,.vv-tooltip:not([disabled]):hover .vv-tooltip__content){opacity:var(--vv-tooltip-state-hover-element-content-opacity);will-change:var(--vv-tooltip-state-hover-element-content-will-change);transition:var(--vv-tooltip-state-hover-element-content-transition)}:where(.vv-tooltip--top .vv-tooltip__content){margin:var(--vv-tooltip-modifier-top-element-content-margin);inset-inline:var(--vv-tooltip-modifier-top-element-content-inset-inline);inset-block:var(--vv-tooltip-modifier-top-element-content-inset-block)}:where(.vv-tooltip--top .vv-tooltip__content):after{content:"";position:var(--vv-tooltip-modifier-top-element-content-pseudo-after-position);z-index:var(--vv-tooltip-modifier-top-element-content-pseudo-after-z-index);inset-inline:var(--vv-tooltip-modifier-top-element-content-pseudo-after-inset-inline);inset-block:var(--vv-tooltip-modifier-top-element-content-pseudo-after-inset-block);border:var(--vv-tooltip-modifier-top-element-content-pseudo-after-border);border-color:var(--vv-tooltip-modifier-top-element-content-pseudo-after-border-color)}:where(.vv-tooltip--right .vv-tooltip__content){margin:var(--vv-tooltip-modifier-right-element-content-margin);inset-inline:var(--vv-tooltip-modifier-right-element-content-inset-inline);inset-block:var(--vv-tooltip-modifier-right-element-content-inset-block)}:where(.vv-tooltip--right .vv-tooltip__content):after{content:"";position:var(--vv-tooltip-modifier-right-element-content-pseudo-after-position);z-index:var(--vv-tooltip-modifier-right-element-content-pseudo-after-z-index);inset-inline:var(--vv-tooltip-modifier-right-element-content-pseudo-after-inset-inline);inset-block:var(--vv-tooltip-modifier-right-element-content-pseudo-after-inset-block);transform:var(--vv-tooltip-modifier-right-element-content-pseudo-after-transform);border:var(--vv-tooltip-modifier-right-element-content-pseudo-after-border);border-color:var(--vv-tooltip-modifier-right-element-content-pseudo-after-border-color)}:where(.vv-tooltip--bottom .vv-tooltip__content){margin:var(--vv-tooltip-modifier-bottom-element-content-margin);inset-inline:var(--vv-tooltip-modifier-bottom-element-content-inset-inline);inset-block:var(--vv-tooltip-modifier-bottom-element-content-inset-block)}:where(.vv-tooltip--bottom .vv-tooltip__content):after{content:"";position:var(--vv-tooltip-modifier-bottom-element-content-pseudo-after-position);z-index:var(--vv-tooltip-modifier-bottom-element-content-pseudo-after-z-index);inset-inline:var(--vv-tooltip-modifier-bottom-element-content-pseudo-after-inset-inline);inset-block:var(--vv-tooltip-modifier-bottom-element-content-pseudo-after-inset-block);border:var(--vv-tooltip-modifier-bottom-element-content-pseudo-after-border);border-color:var(--vv-tooltip-modifier-bottom-element-content-pseudo-after-border-color)}:where(.vv-tooltip--left .vv-tooltip__content){margin:var(--vv-tooltip-modifier-left-element-content-margin);inset-inline:var(--vv-tooltip-modifier-left-element-content-inset-inline);inset-block:var(--vv-tooltip-modifier-left-element-content-inset-block)}:where(.vv-tooltip--left .vv-tooltip__content):after{content:"";position:var(--vv-tooltip-modifier-left-element-content-pseudo-after-position);z-index:var(--vv-tooltip-modifier-left-element-content-pseudo-after-z-index);inset-inline:var(--vv-tooltip-modifier-left-element-content-pseudo-after-inset-inline);inset-block:var(--vv-tooltip-modifier-left-element-content-pseudo-after-inset-block);transform:var(--vv-tooltip-modifier-left-element-content-pseudo-after-transform);border:var(--vv-tooltip-modifier-left-element-content-pseudo-after-border);border-color:var(--vv-tooltip-modifier-left-element-content-pseudo-after-border-color)}
1
+ :where(:host,:root,.theme){--vv-tooltip-position: relative;--vv-tooltip-display: inline-flex;--vv-tooltip-align-items: center;--vv-tooltip-element-content-opacity: 0;--vv-tooltip-element-content-position: absolute;--vv-tooltip-element-content-z-index: var(--z-tooltip);--vv-tooltip-element-content-display: block;--vv-tooltip-element-content-min-width: var(--spacing-160);--vv-tooltip-element-content-border-radius: var(--rounded-md);--vv-tooltip-element-content-border-width: 2px;--vv-tooltip-element-content-border-style: solid;--vv-tooltip-element-content-border-color: var(--color-gray-darken-4);--vv-tooltip-element-content-padding: var(--spacing-4) var(--spacing-sm);--vv-tooltip-element-content-margin: 0 0 0 var(--spacing-xs);--vv-tooltip-element-content-background: var(--color-gray-darken-4);--vv-tooltip-element-content-font-size: var(--text-12);--vv-tooltip-element-content-font-weight: var(--font-normal);--vv-tooltip-element-content-color: var(--color-gray-lighten-5);--vv-tooltip-element-content-text-align: center;--vv-tooltip-element-content-inset-inline: 100% auto;--vv-tooltip-element-content-inset-block: auto;--vv-tooltip-element-content-box-shadow: var(--shadow-md);--vv-tooltip-element-content-pseudo-after-position: absolute;--vv-tooltip-element-content-pseudo-after-z-index: -1;--vv-tooltip-element-content-pseudo-after-inset-inline: -10% auto;--vv-tooltip-element-content-pseudo-after-inset-block: 50% auto;--vv-tooltip-element-content-pseudo-after-transform: translateY(-50%);--vv-tooltip-element-content-pseudo-after-border-width: 10px;--vv-tooltip-element-content-pseudo-after-border-style: solid;--vv-tooltip-element-content-pseudo-after-border-color: transparent var(--color-gray-darken-4) transparent transparent;--vv-tooltip-modifier-top-element-content-margin: 0 0 var(--spacing-xs) 0;--vv-tooltip-modifier-top-element-content-inset-inline: auto;--vv-tooltip-modifier-top-element-content-inset-block: auto 100%;--vv-tooltip-modifier-top-element-content-pseudo-after-position: absolute;--vv-tooltip-modifier-top-element-content-pseudo-after-z-index: -1;--vv-tooltip-modifier-top-element-content-pseudo-after-inset-inline: 45% auto;--vv-tooltip-modifier-top-element-content-pseudo-after-inset-block: 130% auto;--vv-tooltip-modifier-top-element-content-pseudo-after-border-width: 10px;--vv-tooltip-modifier-top-element-content-pseudo-after-border-style: solid;--vv-tooltip-modifier-top-element-content-pseudo-after-border-color: var(--color-gray-darken-4) transparent transparent;--vv-tooltip-modifier-right-element-content-margin: 0 0 0 var(--spacing-xs);--vv-tooltip-modifier-right-element-content-inset-inline: 100% auto;--vv-tooltip-modifier-right-element-content-inset-block: auto;--vv-tooltip-modifier-right-element-content-pseudo-after-position: absolute;--vv-tooltip-modifier-right-element-content-pseudo-after-z-index: -1;--vv-tooltip-modifier-right-element-content-pseudo-after-inset-inline: -10% auto;--vv-tooltip-modifier-right-element-content-pseudo-after-inset-block: 50% auto;--vv-tooltip-modifier-right-element-content-pseudo-after-transform: translateY(-50%);--vv-tooltip-modifier-right-element-content-pseudo-after-border-width: 10px;--vv-tooltip-modifier-right-element-content-pseudo-after-border-style: solid;--vv-tooltip-modifier-right-element-content-pseudo-after-border-color: transparent var(--color-gray-darken-4) transparent transparent;--vv-tooltip-modifier-bottom-element-content-margin: var(--spacing-xs) 0 0 0;--vv-tooltip-modifier-bottom-element-content-inset-inline: auto;--vv-tooltip-modifier-bottom-element-content-inset-block: 100% auto;--vv-tooltip-modifier-bottom-element-content-pseudo-after-position: absolute;--vv-tooltip-modifier-bottom-element-content-pseudo-after-z-index: -1;--vv-tooltip-modifier-bottom-element-content-pseudo-after-inset-inline: 45% auto;--vv-tooltip-modifier-bottom-element-content-pseudo-after-inset-block: auto 50%;--vv-tooltip-modifier-bottom-element-content-pseudo-after-border-width: 10px;--vv-tooltip-modifier-bottom-element-content-pseudo-after-border-style: solid;--vv-tooltip-modifier-bottom-element-content-pseudo-after-border-color: transparent transparent var(--color-gray-darken-4) transparent;--vv-tooltip-modifier-left-element-content-margin: 0 var(--spacing-xs) 0 0;--vv-tooltip-modifier-left-element-content-inset-inline: auto 100%;--vv-tooltip-modifier-left-element-content-inset-block: auto;--vv-tooltip-modifier-left-element-content-pseudo-after-position: absolute;--vv-tooltip-modifier-left-element-content-pseudo-after-z-index: -1;--vv-tooltip-modifier-left-element-content-pseudo-after-inset-inline: auto -10%;--vv-tooltip-modifier-left-element-content-pseudo-after-inset-block: 50% auto;--vv-tooltip-modifier-left-element-content-pseudo-after-transform: translateY(-50%);--vv-tooltip-modifier-left-element-content-pseudo-after-border-width: 10px;--vv-tooltip-modifier-left-element-content-pseudo-after-border-style: solid;--vv-tooltip-modifier-left-element-content-pseudo-after-border-color: transparent transparent transparent var(--color-gray-darken-4);--vv-tooltip-state-hover-element-content-opacity: 1;--vv-tooltip-state-hover-element-content-will-change: opacity;--vv-tooltip-state-hover-element-content-transition: opacity .3s ease-in-out}:where(.vv-tooltip){position:var(--vv-tooltip-position);display:var(--vv-tooltip-display);align-items:var(--vv-tooltip-align-items)}:where(.vv-tooltip__content){opacity:var(--vv-tooltip-element-content-opacity);position:var(--vv-tooltip-element-content-position);z-index:var(--vv-tooltip-element-content-z-index);display:var(--vv-tooltip-element-content-display);min-width:var(--vv-tooltip-element-content-min-width);border-radius:var(--vv-tooltip-element-content-border-radius);border-width:var(--vv-tooltip-element-content-border-width);border-style:var(--vv-tooltip-element-content-border-style);border-color:var(--vv-tooltip-element-content-border-color);padding:var(--vv-tooltip-element-content-padding);margin:var(--vv-tooltip-element-content-margin);background:var(--vv-tooltip-element-content-background);font-size:var(--vv-tooltip-element-content-font-size);font-weight:var(--vv-tooltip-element-content-font-weight);color:var(--vv-tooltip-element-content-color);text-align:var(--vv-tooltip-element-content-text-align);inset-inline:var(--vv-tooltip-element-content-inset-inline);inset-block:var(--vv-tooltip-element-content-inset-block);box-shadow:var(--vv-tooltip-element-content-box-shadow)}:where(.vv-tooltip__content):after{content:"";position:var(--vv-tooltip-element-content-pseudo-after-position);z-index:var(--vv-tooltip-element-content-pseudo-after-z-index);inset-inline:var(--vv-tooltip-element-content-pseudo-after-inset-inline);inset-block:var(--vv-tooltip-element-content-pseudo-after-inset-block);transform:var(--vv-tooltip-element-content-pseudo-after-transform);border-width:var(--vv-tooltip-element-content-pseudo-after-border-width);border-style:var(--vv-tooltip-element-content-pseudo-after-border-style);border-color:var(--vv-tooltip-element-content-pseudo-after-border-color)}:where(.vv-tooltip--hover .vv-tooltip__content,.vv-tooltip.hover .vv-tooltip__content,.vv-tooltip:not([disabled]):hover .vv-tooltip__content){opacity:var(--vv-tooltip-state-hover-element-content-opacity);will-change:var(--vv-tooltip-state-hover-element-content-will-change);transition:var(--vv-tooltip-state-hover-element-content-transition)}:where(.vv-tooltip--top .vv-tooltip__content){margin:var(--vv-tooltip-modifier-top-element-content-margin);inset-inline:var(--vv-tooltip-modifier-top-element-content-inset-inline);inset-block:var(--vv-tooltip-modifier-top-element-content-inset-block)}:where(.vv-tooltip--top .vv-tooltip__content):after{content:"";position:var(--vv-tooltip-modifier-top-element-content-pseudo-after-position);z-index:var(--vv-tooltip-modifier-top-element-content-pseudo-after-z-index);inset-inline:var(--vv-tooltip-modifier-top-element-content-pseudo-after-inset-inline);inset-block:var(--vv-tooltip-modifier-top-element-content-pseudo-after-inset-block);border-width:var(--vv-tooltip-modifier-top-element-content-pseudo-after-border-width);border-style:var(--vv-tooltip-modifier-top-element-content-pseudo-after-border-style);border-color:var(--vv-tooltip-modifier-top-element-content-pseudo-after-border-color)}:where(.vv-tooltip--right .vv-tooltip__content){margin:var(--vv-tooltip-modifier-right-element-content-margin);inset-inline:var(--vv-tooltip-modifier-right-element-content-inset-inline);inset-block:var(--vv-tooltip-modifier-right-element-content-inset-block)}:where(.vv-tooltip--right .vv-tooltip__content):after{content:"";position:var(--vv-tooltip-modifier-right-element-content-pseudo-after-position);z-index:var(--vv-tooltip-modifier-right-element-content-pseudo-after-z-index);inset-inline:var(--vv-tooltip-modifier-right-element-content-pseudo-after-inset-inline);inset-block:var(--vv-tooltip-modifier-right-element-content-pseudo-after-inset-block);transform:var(--vv-tooltip-modifier-right-element-content-pseudo-after-transform);border-width:var(--vv-tooltip-modifier-right-element-content-pseudo-after-border-width);border-style:var(--vv-tooltip-modifier-right-element-content-pseudo-after-border-style);border-color:var(--vv-tooltip-modifier-right-element-content-pseudo-after-border-color)}:where(.vv-tooltip--bottom .vv-tooltip__content){margin:var(--vv-tooltip-modifier-bottom-element-content-margin);inset-inline:var(--vv-tooltip-modifier-bottom-element-content-inset-inline);inset-block:var(--vv-tooltip-modifier-bottom-element-content-inset-block)}:where(.vv-tooltip--bottom .vv-tooltip__content):after{content:"";position:var(--vv-tooltip-modifier-bottom-element-content-pseudo-after-position);z-index:var(--vv-tooltip-modifier-bottom-element-content-pseudo-after-z-index);inset-inline:var(--vv-tooltip-modifier-bottom-element-content-pseudo-after-inset-inline);inset-block:var(--vv-tooltip-modifier-bottom-element-content-pseudo-after-inset-block);border-width:var(--vv-tooltip-modifier-bottom-element-content-pseudo-after-border-width);border-style:var(--vv-tooltip-modifier-bottom-element-content-pseudo-after-border-style);border-color:var(--vv-tooltip-modifier-bottom-element-content-pseudo-after-border-color)}:where(.vv-tooltip--left .vv-tooltip__content){margin:var(--vv-tooltip-modifier-left-element-content-margin);inset-inline:var(--vv-tooltip-modifier-left-element-content-inset-inline);inset-block:var(--vv-tooltip-modifier-left-element-content-inset-block)}:where(.vv-tooltip--left .vv-tooltip__content):after{content:"";position:var(--vv-tooltip-modifier-left-element-content-pseudo-after-position);z-index:var(--vv-tooltip-modifier-left-element-content-pseudo-after-z-index);inset-inline:var(--vv-tooltip-modifier-left-element-content-pseudo-after-inset-inline);inset-block:var(--vv-tooltip-modifier-left-element-content-pseudo-after-inset-block);transform:var(--vv-tooltip-modifier-left-element-content-pseudo-after-transform);border-width:var(--vv-tooltip-modifier-left-element-content-pseudo-after-border-width);border-style:var(--vv-tooltip-modifier-left-element-content-pseudo-after-border-style);border-color:var(--vv-tooltip-modifier-left-element-content-pseudo-after-border-color)}