import styled from "@emotion/styled"

export const FileActions = styled.div`
  font-size: 1.5em;
  margin-bottom: -0.1em;
  a {
    margin-right: 0.25em;
    &:focus {
      color: unset;
    }
  }
`

export const Section = styled.div`
  border-bottom: 1px solid #ddd;
  line-height: 1.7em;
  padding: 0.3em 0 0.5em;

  &:first-of-type {
    padding-top: 0.2em;
  }

  &:last-of-type {
    border-bottom: none;
    padding-bottom: 0.4em;
  }

  @media (prefers-color-scheme: dark) {
    border-bottom-color: #222;
  }
`

export const Popup = {
  Container: styled.div`
    padding: 0 3px 0 8px;
  `,
  Block: styled.div`
    display: flex;
  `,
  EntryLeft: styled.div`
    display: flex;
    flex-grow: 1;
    padding-right: 0.1rem;
  `,
}
