koel/resources/assets/css/partials/shared.pcss

@tailwind base;

@layer base {
  h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  blockquote {
    @apply text-balance;
  }

  *::marker {
    @apply hidden !important;
  }

  :root {
    color-scheme: dark;
  }

  ::placeholder {
    @apply text-black/5;
  }

  body,
  html {
    @mixin themed-background;

    font-family: var(--font-family);
    font-size: 13px;

    @apply text-k-text-primary font-light leading-6 overflow-hidden;
  }

  input,
  select,
  button,
  textarea,
  .btn {
    font-family: var(--font-family);

    @apply appearance-none border-0 outline-0 text-base font-light;

    &:required,
    &:invalid {
      @apply shadow-none;
    }

    &::-moz-focus-inner {
      @apply border-0 !important;
    }
  }

  a {
    @apply no-underline text-k-text-primary cursor-pointer hover:text-k-accent focus:text-k-accent;

    &:link,
    &:visited {
      @apply text-k-accent;
    }
  }

  :root {
    --fade-size: 3rem;
  }

  button,
  [role='button'] {
    @apply touch-manipulation select-none cursor-pointer focus-visible:outline-1 focus-visible:outline-k-accent;
  }

  * {
    @apply focus-visible:ring-0 focus-visible:outline-1 focus-visible:outline-k-accent;
  }
}