/* File input: [type=file] */

[type="file"] {
  --pico-color: var(--pico-muted-color);
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;

  /* Tonal secondary button, as tall as the other controls */
  &::file-selector-button {
    margin-block: 0;
    margin-inline: 0 0.75rem;
    padding: var(--pico-form-element-spacing-vertical) var(--pico-form-element-spacing-horizontal);
  }

  &:is(:hover, :active, :focus)::file-selector-button {
    --pico-background-color: var(--pico-secondary-hover-background);
    --pico-border-color: var(--pico-secondary-hover-border);
  }

  &:focus-visible::file-selector-button {
    outline: var(--pico-outline-width) solid var(--pico-secondary-focus);
    outline-offset: var(--pico-outline-width);
  }
}
