@layer components {
  .select {
    background-color: white;
    border-radius: var(--radius-1);
    border: solid 1px var(--gray-3);
    box-shadow: var(--shadow-1);
    display: inline-block;
    font: inherit;
    outline: none;
    padding: var(--size-2) var(--size-2);
    height: 100%;

    &:focus {
      border-color: var(--blue-8);
    }
  }

  .select\:full {
    width: 100%;
  }
}