/* #2105 (#6899) listebonus.com ek stiller — mevcut public.css paletine (amber/siyah) uyumlu, yalnız yeni bileşenler */

/* Üst bar (navbar içinde, sabit) */
.ek-ustbar { font-size: .78rem; margin: -12px 0 8px; padding: 5px 0; background: rgba(245,158,11,.08); border-bottom: 1px solid rgba(245,158,11,.18); }
.ek-guncel { color: var(--text-muted); white-space: nowrap; }
.ek-ustbar-cta { color: #000; background: var(--gradient-amber); border-radius: 999px; padding: 2px 12px; font-weight: 700; white-space: nowrap; }
.ek-ustbar-cta:hover { color: #000; filter: brightness(1.08); }
.ek-no { display: inline-flex; align-items: center; justify-content: center; width: 18px; height: 18px; border-radius: 50%; background: #000; color: var(--amber); font-size: .7rem; font-weight: 800; }
@media (max-width: 575px) { .ek-guncel .bi { display: none; } .ek-ustbar { font-size: .72rem; } }

/* Hero Betzula 1. sıra kutusu */
.ek-hero-bir { display: flex; align-items: center; gap: 14px; margin-top: 22px; padding: 12px 16px; background: rgba(245,158,11,.08); border: 1px solid rgba(245,158,11,.35); border-radius: var(--radius); max-width: 560px; }
.ek-hero-bir img { width: 56px; height: 56px; object-fit: contain; border-radius: 10px; background: #000; }
.ek-hero-bir .ek-hero-metin { flex: 1; line-height: 1.3; }
.ek-hero-bir .ek-hero-metin small { color: var(--amber); font-weight: 700; letter-spacing: .03em; text-transform: uppercase; font-size: .7rem; }
.ek-hero-bir .ek-hero-metin strong { display: block; color: var(--text-primary); font-size: 1.05rem; }
.ek-hero-bir .ek-hero-metin span { color: var(--text-secondary); font-size: .82rem; }

/* Sabit CTA */
.ek-sticky-cta { position: fixed; right: 18px; bottom: 18px; z-index: 1040; display: flex; align-items: center; gap: 8px; padding: 10px 16px; background: var(--gradient-amber); color: #000; border-radius: 999px; box-shadow: 0 6px 24px rgba(0,0,0,.45); font-size: .9rem; }
.ek-sticky-cta:hover { color: #000; filter: brightness(1.08); }
.ek-sticky-cta strong { background: #000; color: var(--amber); padding: 2px 10px; border-radius: 999px; font-size: .8rem; }
@media (max-width: 767px) { .ek-sticky-cta { bottom: 74px; right: 12px; padding: 8px 12px; font-size: .82rem; } }

/* Hub SSS */
.ek-sss h2 { font-size: 1.3rem; margin-bottom: 14px; }
.ek-sss details { background: var(--bg-card); border: 1px solid var(--border-color); border-radius: 10px; margin-bottom: 10px; padding: 0 16px; }
.ek-sss summary { cursor: pointer; padding: 14px 0; font-weight: 600; color: var(--text-primary); }
.ek-sss details[open] summary { color: var(--amber); }
.ek-sss details p { color: var(--text-secondary); padding-bottom: 14px; margin: 0; line-height: 1.7; }
.ek-baglanti { font-size: .9rem; color: var(--text-muted); }

/* Marka kartları */
.ek-markalar { padding: 60px 0; background: var(--bg-primary); border-top: 1px solid var(--border-color); }
.ek-marka-kart { position: relative; display: flex; flex-direction: column; gap: 4px; height: 100%; padding: 12px; background: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--radius); color: var(--text-secondary); transition: var(--transition); }
.ek-marka-kart:hover { border-color: rgba(245,158,11,.45); background: var(--bg-card-hover); color: var(--text-secondary); }
.ek-marka-kart img { width: 100%; height: auto; aspect-ratio: 240/96; border-radius: 8px; margin-bottom: 6px; }
.ek-rozet { align-self: flex-start; font-size: .62rem; font-weight: 800; letter-spacing: .04em; padding: 2px 8px; border-radius: 999px; }
.ek-rozet-deneme { background: var(--gradient-amber); color: #000; }
.ek-rozet-yatirim { background: rgba(255,255,255,.08); color: var(--text-primary); border: 1px solid rgba(255,255,255,.14); }
.ek-marka-ad { color: var(--text-primary); font-size: 1rem; }
.ek-marka-tutar { color: var(--amber); font-weight: 700; }
.ek-marka-tip, .ek-marka-cevrim { font-size: .8rem; }
.ek-marka-not { font-size: .78rem; color: var(--text-muted); line-height: 1.45; }
.ek-bilgi { margin-top: auto; padding-top: 6px; font-size: .68rem; color: var(--text-muted); font-style: italic; }

/* Firma detay */
.ek-firma-tablo { width: 100%; border-collapse: collapse; }
.ek-firma-tablo th, .ek-firma-tablo td { padding: 10px 12px; border-bottom: 1px solid var(--border-color); vertical-align: top; }
.ek-firma-tablo th { width: 38%; color: var(--text-muted); font-weight: 500; }
.ek-firma-tablo td { color: var(--text-primary); }
.ek-firma-logo { width: 100%; max-width: 240px; border-radius: 10px; }
.ek-kardes { display: flex; flex-wrap: wrap; gap: 8px; }
.ek-kardes a { padding: 6px 12px; border: 1px solid var(--border-color); border-radius: 999px; font-size: .85rem; color: var(--text-secondary); background: var(--bg-card); }
.ek-kardes a:hover { border-color: var(--amber); color: var(--amber); }
.ek-uyari { font-size: .8rem; color: var(--text-muted); }

/* v2: üst bar navbar içinde kendi satırında (navbar-expand-lg nowrap'ı aşılır) */
.navbar.fixed-top { flex-wrap: wrap !important; }
.navbar .ek-ustbar { flex: 0 0 100%; }
@media (max-width: 575px) {
  .ek-hero-bir { flex-wrap: wrap; text-align: left; }
  .ek-hero-bir .ek-hero-metin { flex: 1 1 calc(100% - 72px); }
  .ek-hero-bir .btn { flex: 1 1 100%; }
}