.page {
  @apply relative border pl-4 pb-4 dark:border-zinc-100/10;
  @apply rounded bg-zinc-100 dark:bg-zinc-900;

  .delete {
    @apply opacity-50 hover:opacity-75;
    @apply rotate-0 hover:rotate-90;
    @apply transition-[opacity,transform];
  }

  .container {
    @apply grid grid-cols-2 gap-2;
  }

  .heading {
    @apply relative z-10 my-3;
    @apply text-xs font-semibold;
  }
}

.column {
  @apply relative w-full px-4;

  .heading {
    @apply relative z-10 my-3;
    @apply text-xs font-semibold;
  }

  .base {
    @apply absolute inset-0 w-4/5;
    @apply rounded bg-zinc-200 dark:bg-zinc-800;
  }
}

.section {
  @apply relative my-3 w-full px-4 py-2;
  @apply cursor-move break-all rounded text-xs capitalize;
  @apply bg-zinc-900/90 text-zinc-50 dark:bg-zinc-50/90 dark:text-zinc-900;

  &.disabled {
    @apply opacity-60;
  }
}