/* —————————— Overlay genel ayarları —————————— */
#page-loader {
  position: fixed;
  inset: 0;
  background: #ffff;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  z-index: 2000;
  transition: opacity 0.3s ease, visibility 0.3s ease;
  background-image: linear-gradient(to bottom, rgba(36, 173, 73, 0.10) 0%, transparent 20%, transparent 80%, rgba(36, 173, 73, 0.10) 100%);

}

#page-loader.loaded {
  opacity: 0;
  visibility: hidden;
  transition-delay: 0.5s;
}

.loader {
  --s: 15px;
  width: calc(var(--s) * 2.33);
  aspect-ratio: 1;
  display: flex;
  justify-content: space-between;
  background-color: #ffffff;
  /* zemin beyaz kalsın */
}

.loader::before,
.loader::after {
  content: "";
  width: var(--s);
  /* Sadece buradaki rengi değiştirdik */
  --_g: no-repeat radial-gradient(farthest-side, #24ad49 94%, #0000);
  background: var(--_g) top, var(--_g) bottom;
  background-size: 100% var(--s);
  transform-origin: 50% calc(100% - var(--s) / 2);
  animation: l30 1s infinite;
}

.loader::after {
  transform-origin: 50% calc(var(--s) / 2);
}

@keyframes l30 {

  70%,
  100% {
    transform: rotate(-270deg);
  }
}