/* ===== Topluluk ===== */

.cc_XBicLfRnK3_xEedDLQCOO .alg-topluluk__ust {
  flex-wrap: wrap;
  gap: 1rem 2rem;
}

.cc_XBicLfRnK3_xEedDLQCOO .alg-topluluk__metin {
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
}

.cc_XBicLfRnK3_xEedDLQCOO .alg-topluluk__takip {
  gap: 0.5rem;
}

/* Kullanıcı adı olduğu gibi kalır (düğme yazısı büyük harfe çevrilir) */
.cc_XBicLfRnK3_xEedDLQCOO .alg-topluluk__hesap {
  text-transform: none;
  letter-spacing: 0.04em;
}

/* ===== Şerit =====
   Şerit kenardan kenara kayar; ilk kart başlıkla aynı hizadan başlar. Başlık .alg-kap içinde durur, şerit dışında;
   bu yüzden kabın değişkenleri (kenar boşlukları, en geniş genişlik) şeridin sarmalayıcısına da satır içi verilir
   (index.tsx, kapSeritStili). --alg-serit-en: kabın sınırı; sınır yoksa 100% olur, sol boşluk yalnız kenar kalır.
   (Eskiden sabit 100rem varsayılıyordu: sınırsız genişlikte kartlar başlıktan yüzlerce px içeride başlıyordu.) */
.cc_XBicLfRnK3_xEedDLQCOO .alg-topluluk__kap {
  --alg-kenar: var(--alg-kenar-telefon, 1.25rem);
  --alg-topluluk-kenar: max(var(--alg-kenar), calc((100% - var(--alg-serit-en, 100%)) / 2 + var(--alg-kenar)));
  position: relative;
}

@media (min-width: 768px) {
  .cc_XBicLfRnK3_xEedDLQCOO .alg-topluluk__kap {
    --alg-kenar: var(--alg-kenar-tablet, 2rem);
  }
}

@media (min-width: 1024px) {
  .cc_XBicLfRnK3_xEedDLQCOO .alg-topluluk__kap {
    --alg-kenar: var(--alg-kenar-masaustu, 3rem);
  }
}

.cc_XBicLfRnK3_xEedDLQCOO .alg-topluluk__serit {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: clamp(12.5rem, 18vw, 16.5rem);
  gap: 0.75rem;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  padding-inline: var(--alg-topluluk-kenar);
  scroll-padding-inline: var(--alg-topluluk-kenar);
}

.cc_XBicLfRnK3_xEedDLQCOO .alg-topluluk__serit::-webkit-scrollbar {
  display: none;
}

/* Oklar yalnız fareli geniş ekranda; telefonda ve tablette parmakla kaydırılır */
.cc_XBicLfRnK3_xEedDLQCOO .alg-topluluk__ok {
  display: none;
}

@media (min-width: 1024px) and (hover: hover) {
  .cc_XBicLfRnK3_xEedDLQCOO .alg-topluluk__ok {
    display: flex;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: var(--kombos-z-dropdown);
    background: rgba(255, 255, 255, 0.85);
  }

  .cc_XBicLfRnK3_xEedDLQCOO .alg-topluluk__ok:disabled {
    opacity: 0;
    pointer-events: none;
  }

  .cc_XBicLfRnK3_xEedDLQCOO .alg-topluluk__ok--sol {
    left: max(0.5rem, calc(var(--alg-topluluk-kenar) - 1.25rem));
  }

  .cc_XBicLfRnK3_xEedDLQCOO .alg-topluluk__ok--sag {
    right: max(0.5rem, calc(var(--alg-topluluk-kenar) - 1.25rem));
  }
}