.pagination{ @apply grid-container mt-lg /*mt-sm md:mt-12.5 xl:mt-25*/; ul{ @apply flex flex-wrap items-center justify-center; li{ &:first-child, &:last-child{ @apply hidden lg:inline-flex; &:has(> span){ @apply text-grey-300 cursor-not-allowed; } @at-root body.has-primary-bg .pagination ul li:first-child:has(> span){ @apply text-yellow-400; } @at-root body.has-primary-bg .pagination ul li:last-child:has(> span){ @apply text-yellow-400; } } &:first-child{ @apply mr-5; } &:last-child{ @apply ml-5; } &:not(:first-child):not(:last-child){ @apply mr-0.5; a, span{ @apply w-9 h-9 inline-flex items-center justify-center; } } &.is-active{ @apply bg-black text-white; @at-root body.has-primary-bg .pagination ul li.is-active{ @apply text-yellow-100; } } } } }