@layer base {

  *,
  ::after,
  ::before,
  ::backdrop,
  ::file-selector-button {
    border-color: var(--color-gray-200, currentcolor);
  }
}

@layer components {

  body {
    @apply m-0 p-0 bg-white color-primary-text;
  }

  section {
    @apply w-full overflow-hidden;
  }

  a {
    @apply text-inherit;
  }

  ul {
    @apply m-0 p-0;
  }

  h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  p {
    @apply m-0;
  }
}

@theme {

  --color-text-primary: #535862;
  --color-text-secondary: #414651;
  --color-text-magenta: #7f56d9;
  --color-text-dark: #181d27;
  --color-text-gray: #717171;
  --color-text-footer: #717680;

  --color-text-dark-green: #0dcb57;
  --color-text-light-green: #027a48;
  --color-white: #fff;
  --color-black: #000;

  --bg-color-primary-light: #fafafa;
  --bg-color-primary-gray: #d2d2d2;
  --bg-color-primary-dark: #181d27;
  --bg-color-magenta: #7f56d9;

  --border-color-light: #d5d7da;
  --border-color-magenta: #7f56d9;

  --signup-page-gradient: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 79.24%);
}

.signup-page-container .testimonial-bg {
  background-image:
    linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 79.24%),
    url("/assets/devise/signup-container-image-98538981.png");
}

.login-page-container .testimonial-bg {
  background-image:
    /* linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 79.24%), */
    url("/assets/devise/login-container-image-f865b17e.png");
}

.shadow-primary {
  box-shadow: 0px 1px 2px 0px rgba(10, 13, 18, 0.05);
}