import styled, { css } from 'styled-components/macro'

import { facr as platformFacr } from 'config/clients/facr'

import type { ClientConfig } from './types'

const Background = styled.div`
  position: relative;
  width: 100%;
  min-height: 100vh;
  display: flex;
  justify-content: center;
  background-color: #00257A;
`

export const facr: ClientConfig = {
  ...platformFacr,
  background: Background,
  styles: {
    input: css`
      background-color: transparent;
      :not(:last-child) {
        border-color: ${({ theme }) => theme.colors.text100};
      }
    `,
    inputGroup: css`
      border: 1px solid ${({ theme }) => theme.colors.text100};
    `,
    loader: css`
      color: #00257A;
    `,
    logo: css`
      background-image: url(/images/facr_auth_logo.png);
      height: 163px;
      width: 213px;
    `,
    submitButton: css`
      background-color: ${({ theme }) => theme.colors.text100};
      color: #00257A;
    `,
  },
}
