:root {
  --notion-max-width: 100%;
  --notion-font: var(--display-font);
}

.notion {
  @apply font-display;
}

.notion-page {
  @apply px-0;

  .notion-asset-wrapper iframe {
    @apply bg-transparent;
  }
  .notion-column {
    @apply overflow-hidden;
  }
  .notion-inline-code {
    @apply text-primary bg-background/20 border backdrop-saturate-200 backdrop-brightness-150 backdrop-blur-sm border-primary/40 rounded px-1;
  }
}

.notion-collection-header-title {
  @apply font-display font-medium text-xl;
}

.stories-section {
  .notion-collection-header {
    @apply hidden;
  }
  .notion-collection-card-cover {
    @apply h-24 opacity-80 backdrop-saturate-150 brightness-125;
  }
  .notion-collection-card {
    @apply rounded shadow bg-transparent backdrop-contrast-125 backdrop-saturate-200;
  }
  .notion-page-icon-span {
    @apply flex items-center justify-center;
  }
  .notion-page-title-icon {
    @apply w-4 h-4;
  }
  .notion-gallery-grid {
    @apply border-none pt-0;
  }
  .notion-gallery-grid-size-medium {
    @apply md:grid-cols-2;
  }
}

.notion-text {
  img {
    @apply inline;
  }
}

.notion-external,
.notion-bookmark {
  @apply bg-background/10 border rounded-lg hover:no-underline backdrop-brightness-150 backdrop-contrast-150 backdrop-saturate-150 backdrop-blur-sm;
}
.notion-bookmark {
  // @apply rounded-lg border md:flex-row flex-col-reverse bg-background/10 border-primary/40 hover:no-underline;

  & > div:first-child {
    @apply flex-none md:flex-1 md:basis-36;
  }
  .notion-bookmark-title {
    @apply font-display font-bold text-lg;
  }
  .notion-bookmark-link {
    @apply opacity-60;
  }
  .notion-bookmark-image {
    @apply block;
  }
}
