.page-site-map-progress {
  @apply pt-8;
  @apply max-w-xl mx-auto;

  h1 {
    @apply font-bold text-3xl text-neutral-800 mb-6;
  }

  .site-page {
    @apply flex justify-between items-center py-3;
    &__page-name {
      @apply text-neutral-500 font-semibold text-lg h-fit;
      line-height: 1;
    }
    &__status {
      @apply text-sm text-white px-4 py-2 rounded-3xl shrink-0;
      &:after {
        @apply font-semibold tracking-wide;
      }
      &[status='v0'] {
        @apply bg-red-600;
        &:after {
          content: ' À traiter';
        }
      }
      &[status='waiting'] {
        @apply bg-purple-600;

        &:after {
          content: ' Attente de contenu';
        }
      }
      &[status='current'] {
        @apply bg-amber-500;

        &:after {
          content: ' En cours';
        }
      }
      &[status='v1'] {
        @apply bg-blue-500;

        &:after {
          content: ' Intégrée (v1)';
        }
      }
      &[status='v2'] {
        @apply bg-green-400;

        &:after {
          content: ' Fonctionnelle (v2)';
        }
      }
      &[status='v3'] {
        @apply bg-green-700;

        &:after {
          content: '✓';
          color: white;
        }
      }
    }
  }

  .site-page + .site-page {
    @apply border-t border-t-neutral-300;
  }
}
