/* Shared paper hold-progress button state. */

.vk-paper-hold-button.vk-paper-button {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}

.vk-paper-hold-button.vk-paper-button::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  display: none;
  width: 0;
  pointer-events: none;
}

.vk-paper-hold-button.vk-paper-button > * {
  position: relative;
  z-index: 1;
}

.vk-paper-hold-button.vk-paper-button.is-holding::before {
  display: block;
  width: calc(var(--vk-hold-progress, 0) * 100%);
  background:
    linear-gradient(
      to bottom,
      color-mix(in srgb, #000 24%, transparent) 0,
      color-mix(in srgb, #000 12%, transparent) 4px,
      transparent 10px
    ),
    var(--vk-paper-lift-hold-fill, var(--vk-analysis-inset-surface-bg));
  box-shadow: var(--vk-shadow-hold-progress);
  transition: width 40ms linear;
}

.vk-paper-hold-button.vk-paper-button.is-holding:not(:disabled),
.vk-paper-hold-button.vk-paper-button.is-holding:hover:not(:disabled),
.vk-paper-hold-button.vk-paper-button.is-holding:active:not(:disabled) {
  --vk-paper-button-lift: 0px;
  --vk-paper-button-shadow-y: 0px;
  --vk-paper-button-shadow-blur: 0px;
  --vk-paper-button-shadow-alpha: 0;
  --vk-paper-button-bg: var(--vk-paper-lift-button-bg);
  --vk-paper-button-border: var(--vk-analysis-inset-surface-border);

  box-shadow: var(--vk-shadow-form-inset);
  color: var(--vk-paper-lift-button-text);
  transform: translateY(0);
}
