:root {
  // default theme color
  // can be overrided by uses `themeConfig` option
  --slidev-theme-primary: #5d8392;
  --slidev-theme-secondary: red;
  --slidev-theme-code: white; 

}

a, .secondary-color {
  color: var(--slidev-theme-primary);
}

.slidev-layout {
  @apply py-20 px-16;

  p, ul {
    @apply text-xs text-left mr-2;
  }

  li {
    @apply text-left;
    list-style: inside
  }

  p + h2, ul + h2, table + h2 {
    @apply mt-10;
  }

  h1 {
    @apply text-4xl font-serif font-bold;
    color: var(--slidev-theme-primary)
  }

  h1 + p {
    @apply text-center;
  }

  :not(pre) > code {
    font-size: 0.9em;
    padding: 0 0.2rem;
    background: var(--slidev-theme-secondary);
    color: var(--slidev-theme-code);
    @apply font-light py-0.5 rounded;
  }

  pre {
    background: var(--slidev-theme-secondary);
    color: var(--slidev-theme-code);
    @apply font-light px-4 py-2 text-left rounded text-xs mb-6 mt-4 mr-4;
  }

  img {
    @apply rounded;
  }
}

.slidev-layout.cover,
.slidev-layout.intro {
  @apply h-full grid;

  h1 {
    @apply text-6xl leading-20;
  }

  h1 + p {
    @apply -mt-2 opacity-50 mb-4;
  }

  p + h2, ul + h2, table + h2 {
    @apply mt-10;
  }
}