/* Filter list layout (gap control works if it's flex) */
.celof .celof__list{
  display:flex;
  flex-wrap:wrap;
  gap: var(--celof-gap-ui, 0.5rem);
  padding:0;
  margin:0;
  list-style:none;
}

.celof .celof__list .celof__link{
  display:inline-block;
  text-decoration:none;
  border-style: solid;
  border-width: var(--celof-link-border-width, 1px);
  border-radius: var(--celof-link-radius, 0);
  color: var(--celof-link-color, inherit);
  background: var(--celof-link-bg, transparent);
  border-color: var(--celof-link-border, currentColor);
}

.celof .celof__list .celof__link:hover{
  color: var(--celof-link-color-hover, var(--celof-link-color, inherit));
  background: var(--celof-link-bg-hover, var(--celof-link-bg, transparent));
  border-color: var(--celof-link-border-hover, var(--celof-link-border, currentColor));
}

.celof .celof__list .celof__item.is-active > .celof__link,
.celof .celof__list .celof__link[aria-current="page"]{
  color: var(--celof-link-color-active, var(--celof-link-color, inherit));
  background: var(--celof-link-bg-active, var(--celof-link-bg, transparent));
  border-color: var(--celof-link-border-active, var(--celof-link-border, currentColor));
}

/* Focus-visible (keep accessible; don’t remove outlines) */
.celof__link:focus-visible{
  outline: 2px solid currentColor;
  outline-offset: 2px;
}

/* Screen-reader only status text (ARIA live region) */
.celof__sr-status{
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}


/* Results */
.celof-results { width:100%; }

/* Grid */
.celof-results .celof-results__grid{
  display:grid;
  gap:var(--celof-gap);
  grid-template-columns:repeat(var(--celof-cols, 3), minmax(0, 1fr));
}

@media (max-width:1024px){
  .celof-results .celof-results__grid{
    grid-template-columns:repeat(var(--celof-cols-tablet, var(--celof-cols, 3)), minmax(0, 1fr));
  }
}
@media (max-width:767px){
 .celof-results  .celof-results__grid{
    grid-template-columns:repeat(var(--celof-cols-mobile, 1), minmax(0, 1fr));
  }
}

/* Equal height */
.celof-results__grid--equal .celof-results__item{ height:100%; }
.celof-results__grid--equal .celof-results__item > *{ height:100%; }

/* Masonry (CSS columns) */
.celof-results .celof-results__grid--masonry{
  display:block;
  column-count:var(--celof-cols, 3);
  column-gap:var(--celof-gap, 1rem);
}


/* Masonry - fewer items than columns layout fix */
/* cols = 4, but fewer than 4 items (and at least 2) => force 1-row grid */
.celof-results .celof-results__grid--masonry[style*="--celof-cols:4"]
  :has(> .celof-results__item:nth-child(2))
  :not(:has(> .celof-results__item:nth-child(4))) {
  column-count: 1;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
  gap: var(--celof-gap, 1rem);
}

.celof-results .celof-results__grid--masonry[style*="--celof-cols:4"]
  :has(> .celof-results__item:nth-child(2))
  :not(:has(> .celof-results__item:nth-child(4))) > .celof-results__item {
  margin: 0;
  break-inside: auto;
}

/* cols = 3, but fewer than 3 items (and at least 2) => force 1-row grid */
.celof-results .celof-results__grid--masonry[style*="--celof-cols:3"]
  :has(> .celof-results__item:nth-child(2))
  :not(:has(> .celof-results__item:nth-child(3))) {
  column-count: 1;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
  gap: var(--celof-gap, 1rem);
}

.celof-results .celof-results__grid--masonry[style*="--celof-cols:3"]
  :has(> .celof-results__item:nth-child(2))
  :not(:has(> .celof-results__item:nth-child(3))) > .celof-results__item {
  margin: 0;
  break-inside: auto;
}


@media (max-width:1024px){
 .celof-results  .celof-results__grid--masonry{
    column-count:var(--celof-cols-tablet, var(--celof-cols, 3));
  }
}
@media (max-width:767px){
  .celof-results .celof-results__grid--masonry{
    column-count:var(--celof-cols-mobile, 1);
  }
}

@keyframes celof-item-in {
  from {
    transform: translateY(10px) scale(0.975);
	filter:blur(2px);
    opacity: 0;
  }
  to {
    transform: translateY(0) scale(1);
	filter:blur(0);
    opacity: 1;
  }
}

@keyframes celof-item-out {
  from {
	transform: translateY(0) scale(1);
	filter:blur(0);
    opacity: 1;
 
  }
  to {
   transform: translateY(10px) scale(0.975);
	filter:blur(2px);
    opacity: 0.55;
  }
}


.celof-results__item {
  will-change: transform, opacity, filter;
}

.celof-results-container .celof-results__item{
  opacity: 1;
   filter: blur(0);
  transform: translateY(0) scale(1);
  transition: all 0.5s ease;
  animation: celof-item-in 0.5s forwards;
}

.celof-results-container.celof-results--loading .celof-results__item{
  transition: all 0.5s ease;
  opacity: .55;
  filter:blur(2px);
  transform: translateY(10px) scale(0.975);
  animation: celof-item-out 0.5s forwards;
}

.celof-results__grid--masonry .celof-results__item{
  break-inside:avoid;
  margin-bottom:var(--celof-gap, 1rem);
  display:inline-block;
  width:100%;
}

.celof-results__pagination{
	margin-top:2rem; 
	  display:flex;
}

.celof-pagination__row{
  display:flex;
  align-items:center;
  gap: .5rem;
}

.celof-pagination__nums{
  display:flex;
  align-items:center;
  gap: .5rem;
}

.celof-results__pagination button{
  cursor:pointer;
  border-style: solid;
}

.celof-pagination__icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  line-height:1;
}

.celof-pagination__prev,
.celof-pagination__next{
  display:inline-flex;
  align-items:center;
  gap:.4em;
}

.celof-results__pagination .celof-pagination__icon svg {
  fill: currentColor;
  stroke: currentColor;
}

.celof-pagination__more{
  border-style: solid;
  cursor: pointer;
}
.celof-pagination__more:disabled{
  opacity: .6;
}
/* Load More button base */
.celof-results-container .celof-pagination__more{
  color: var(--celof-lm-color, inherit);
  background-color: var(--celof-lm-bg, transparent);
  border-color: var(--celof-lm-border, currentColor);
  border-style: solid;
}

/* Hover */
.celof-results-container .celof-pagination__more:hover{
  color: var(--celof-lm-color-hover, var(--celof-lm-color, inherit));
  background-color: var(--celof-lm-bg-hover, var(--celof-lm-bg, transparent));
  border-color: var(--celof-lm-border-hover, var(--celof-lm-border, currentColor));
}

/* Active (pressed) */
.celof-results-container .celof-pagination__more:active{
  color: var(--celof-lm-color-active, var(--celof-lm-color, inherit));
  background-color: var(--celof-lm-bg-active, var(--celof-lm-bg, transparent));
  border-color: var(--celof-lm-border-active, var(--celof-lm-border, currentColor));
}

/* Disabled */
.celof-results-container .celof-pagination__more:disabled,
.celof-results-container .celof-pagination__more[aria-disabled="true"]{
  opacity: .6;
  cursor: not-allowed;
}