
@layer lmvz-ds.reset, lmvz-ds.theme, lmvz-ds.components, lmvz-ds.overrides;
/**
 * This defines the order of our lmvz-ds' CSS layers. See readme.md for details.
 * Important: Always import this file _before_ layering your own styles!
 */
@layer lmvz-ds.theme {
/**
 * !CAUTION: Changes to this file have to be manually synced into `/packages/styles/src/no-transform/router-font.css` 
 */

@font-face {
  font-family: Router;
  src:
    local('RouterBook-Regular'),
    local('Router-Book'),
    url('/assets/fonts/Router-Book.woff') format('woff');
  font-weight: 400;
}

@font-face {
  font-family: Router;
  src:
    local('RouterMedium-Regular'),
    local('Router-Medium'),
    url('/assets/fonts/Router-Medium.woff') format('woff');
  font-weight: 500;
}

@font-face {
  font-family: Router;
  src:
    local('RouterBold-Regular'),
    local('Router-Bold'),
    url('/assets/fonts/Router-Bold.woff') format('woff');
  font-weight: 700;
}

}
@layer lmvz-ds.reset {
body {
  margin: 0;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0;
}

*[hidden] {
  display: none !important;
}

hr {
  height: 0;
  border: none;
  margin: var(--lmvz-dimension-8-4, clamp(0.25rem, 0.19rem + 0.26vw, 0.5rem)) 0;
  border-top: var(--lmvz-semantic-border-width-default, 1px) solid var(--lmvz-semantic-color-border-subtle, #f0f0f0);
}

fieldset {
  border: none;
  margin: 0;
  padding: 0;
}

legend {
  padding: 0;
  display: block;
}

}
:host {
  /* * the (invalid nested) import will be handled by postcss */
  /* stylelint-disable-next-line no-invalid-position-at-import-rule */
  button {
  /* secondary styling is default, primary is explicit */
  /* --lmvz-button-background, --lmvz-button-color, --lmvz-button-radius are declared on :host
     so that outer ::slotted(lmvz-button) overrides are inherited correctly via shadow inheritance.
     They are also declared here so that non-shadow consumers (e.g. @lmvz-ds/styles buttons.css
     bundle and lmvz-card) have the default values in scope. */
  --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-secondary, #f0f0f0));
  --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-int-on-secondary, #000000));
  --lmvz-button-radius: var(--lmvz-button-radius-override, var(--lmvz-component-input-radius-default, 999px));
  --lmvz-button-padding-inline: var(--lmvz-button-padding-inline-override, var(--lmvz-button-padding, var(--lmvz-component-input-padding-md, clamp(0.88rem, 0.84rem + 0.13vw, 1rem))));
  --lmvz-button-padding-block: var(--lmvz-button-padding-block-override, var(--lmvz-button-padding, var(--lmvz-component-input-padding-md, clamp(0.88rem, 0.84rem + 0.13vw, 1rem))));
  --lmvz-button-gap: var(--lmvz-button-gap-override, var(--lmvz-component-input-gap-md, clamp(0.5rem, 0.44rem + 0.26vw, 0.75rem)));
  --lmvz-button-min-height: var(--lmvz-button-min-height-override, var(--lmvz-component-input-size-md, clamp(2.5rem, 2.44rem + 0.26vw, 2.75rem)));
  --lmvz-button-font: var(--lmvz-button-font-override, var(--lmvz-typography-label-md-strong, normal 700 clamp(0.88rem, 0.84rem + 0.13vw, 1rem) / 1.5
    Router));
  --lmvz-button-border-width: var(--lmvz-button-border-width-override, 0);
  --lmvz-button-border-color: var(--lmvz-button-border-color-override, transparent);

  display: inline-flex;
  align-items: center;
  justify-content: var(--lmvz-button-content-justification-override, center);
  gap: var(--lmvz-button-gap);
  padding-block: var(--lmvz-button-padding-block);
  padding-inline: var(--lmvz-button-padding-inline);
  min-height: var(--lmvz-button-min-height);
  min-width: var(--lmvz-button-min-height);
  border-radius: var(--lmvz-button-radius);
  border: var(--lmvz-button-border-width) solid var(--lmvz-button-border-color);
  background-color: var(--lmvz-button-background);
  color: var(--lmvz-button-color);
  cursor: pointer;
  font: var(--lmvz-button-font);
  /* text-align: center; */
  text-decoration: none;
  white-space: nowrap;
  transition:
    background-color 0.15s ease,
    color 0.15s ease,
    border-color 0.15s ease,
    box-shadow 0.15s ease;
}

button > * {
  font: inherit;
  color: inherit;
}

button:focus-visible {
  outline: var(--lmvz-ds-outline, 1px solid #0e7ab4);
  outline-offset: var(--lmvz-ds-outline-offset, clamp(0.25rem, 0.19rem + 0.26vw, 0.5rem));
  position: relative;
  z-index: 1;
}

button:is([disabled], .disabled) {
  cursor: not-allowed;
  pointer-events: none;
  /* } */

  /* button:is(:is([disabled], .disabled):not(.secondary):not(.tertiary), .primary:is([disabled], .disabled)) { */
  /* button:is([disabled], .disabled) { */
  /* --lmvz-button-background: var(--lmvz-global-color-neutral-500); */
  /* --lmvz-button-color: var(--lmvz-global-color-neutral-white); */
  opacity: var(--lmvz-component-input-disabled-opacity, 40%);
}

button:not([disabled]):hover {
  --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-secondary-hover, #e0e0e0));
}

button:not([disabled]):active {
  --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-secondary-active, #d4d4d4));
}

button.primary {
  --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-primary, #000000));
  --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-int-on-primary, #ffffff));
  --lmvz-button-border-width: var(--lmvz-button-border-width-override, 0);
  --lmvz-button-border-color: var(--lmvz-button-border-color-override, transparent);
}

button.primary:not([disabled], .disabled):hover {
  --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-primary-hover, #2e2e2e));
}

button.primary:not([disabled], .disabled):active {
  --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-primary-active, #545454));
}

button.danger {
  --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-tertiary, #ffffff));
  --lmvz-button-border-color: var(--lmvz-button-border-color-override, transparent);
  --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-status-on-danger, #a31419));
}

button.danger:not([disabled], .disabled):hover {
  --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-status-danger, #fbdfe0));
  --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-status-on-danger, #a31419));
}

button.danger:not([disabled], .disabled):active {
  --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-status-on-danger-subtle, #e8454b));
  --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-status-on-danger, #a31419));
}

button.tertiary {
  --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-tertiary, #ffffff));
  --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-int-on-tertiary, #000000));
}

button.tertiary:not([disabled], .disabled):hover {
  --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-tertiary-hover, #f0f0f0));
  --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-int-on-tertiary-hover, #000000));
}

button.tertiary:not([disabled], .disabled):active {
  --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-tertiary-active, #e0e0e0));
  --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-int-on-tertiary-active, #000000));
}

button.small {
  --lmvz-button-padding-inline: var(--lmvz-button-padding-inline-override, var(--lmvz-component-input-padding-sm, clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem)));
  --lmvz-button-padding-block: var(--lmvz-button-padding-block-override, var(--lmvz-component-input-padding-sm, clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem)));
  --lmvz-button-gap: var(--lmvz-button-gap-override, var(--lmvz-component-input-gap-sm, clamp(0.38rem, 0.31rem + 0.26vw, 0.63rem)));
  --lmvz-button-min-height: var(--lmvz-button-min-height-override, var(--lmvz-component-input-size-sm, clamp(2rem, 1.94rem + 0.26vw, 2.25rem)));
  --lmvz-button-font: var(--lmvz-button-font-override, var(--lmvz-typography-label-sm-strong, normal 700 clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem) / 1.5
    Router));
}

button.large {
  --lmvz-button-padding-inline: var(--lmvz-button-padding-inline-override, var(--lmvz-component-input-padding-lg, clamp(1rem, 0.94rem + 0.26vw, 1.25rem)));
  --lmvz-button-padding-block: var(--lmvz-button-padding-block-override, var(--lmvz-component-input-padding-lg, clamp(1rem, 0.94rem + 0.26vw, 1.25rem)));
  --lmvz-button-gap: var(--lmvz-button-gap-override, var(--lmvz-component-input-gap-lg, clamp(0.75rem, 0.69rem + 0.26vw, 1rem)));
  --lmvz-button-min-height: var(--lmvz-button-min-height-override, var(--lmvz-component-input-size-lg, clamp(2.75rem, 2.69rem + 0.26vw, 3rem)));
  --lmvz-button-font: var(--lmvz-button-font-override, var(--lmvz-typography-label-lg-strong, normal 700 clamp(1rem, 0.97rem + 0.13vw, 1.13rem) / 1.5
    Router));
}


  display: inline-block;

  button {
    width: 100%;
  }
}
::slotted(*) {
  --lmvz-component-color: var(--lmvz-button-color);
}
