/* Shared file-picker form widgets. */

.vk-form-file-shell {
  min-width: 0;
  position: relative;
  display: block;
}

.vk-form-file-name {
  min-width: 0;
  width: 100%;
  height: var(--vk-form-control-height);
  display: flex;
  align-items: center;
  padding: 0 var(--vk-form-control-padding-x);
  border: 1px solid var(--vk-analysis-inset-surface-border);
  border-radius: var(--vk-form-control-radius);
  background: var(--vk-analysis-inset-surface-bg);
  box-shadow: var(--vk-shadow-form-inset);
  color: var(--vk-text-disabled);
  font-family: var(--font-ui);
  font-size: var(--vk-form-control-font-size);
  font-weight: var(--vk-weight-light);
  line-height: var(--vk-line-body);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.vk-form-file-name.has-file {
  color: var(--vk-paper-lift-button-text);
  font-weight: var(--vk-weight-regular);
}

.vk-form-file-picker {
  min-height: 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 0 var(--vk-form-control-padding-x);
  border: 1px dashed var(--vk-paper-depth-inset-bg);
  border-radius: var(--vk-form-control-radius);
  background: var(--vk-paper-depth-raised-max-bg);
  color: var(--vk-text-primary);
  font-size: var(--vk-font-label);
  font-weight: var(--vk-weight-semibold);
  white-space: nowrap;
}

.vk-form-file-picker.vk-paper-button {
  align-self: stretch;
  height: var(--vk-form-control-height);
  min-height: var(--vk-form-control-height);
  max-height: var(--vk-form-control-height);
  box-sizing: border-box;
  padding-top: 0;
  padding-bottom: 0;
  border: 0;
  border-radius: var(--vk-paper-control-radius, 8px);
  line-height: var(--vk-line-compact);
}

.vk-form-file-picker.vk-paper-button.is-accent-needed {
  --vk-paper-button-bg: var(--vk-paper-main-bg);
  color: var(--vk-paper-lift-button-text);
}