/* Deefter yükleme seçenekleri — ortak bileşen (g#77). Aynı dosya: _ortak/assets/css (Market, Restoran / Cafe, hesap) ve deefter.com/assets/css.
   Renkler sistemden (--ks1, --ks2; düğme zemini / yazısı kurulum.js'te WCAG AA'ya göre seçilir); zemin, kenar ve yazı her projenin kendi tema
   değişkenlerinden (uygulamalar --ad-*, deefter.com --yuzey / --cizgi / --yazi); iki temada çalışır. */
.ks-kap {
  --ks-zemin: var(--ad-surface, var(--yuzey, #fff));
  --ks-zemin-2: var(--ad-surface-2, var(--yuzey-2, #f6f7fa));
  --ks-cizgi: var(--ad-border, var(--cizgi, #e2e5ec));
  --ks-yazi: var(--ad-text, var(--yazi, #141a2a));
  --ks-soluk: var(--ad-muted, var(--soluk, #5d6579));
  --ks-vurgu-yazi: color-mix(in srgb, var(--ks2) 62%, #000);
}
[data-bs-theme="dark"] .ks-kap { --ks-vurgu-yazi: color-mix(in srgb, var(--ks1) 78%, #fff); }
.ks-liste { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
/* barındıran sayfanın metin stilleri (ör. deefter.com .metin ul / li / small) bileşeni kaydırmasın */
.ks-kap .ks-liste { margin: 0; padding: 0; }
.ks-kap .ks-satir { margin: 0; }
.ks-kap .ks-metin small { margin-left: 0; }
.ks-satir { display: flex; align-items: center; gap: 10px; min-height: 52px; padding: 7px 8px 7px 8px; border-radius: 14px; border: 1px solid var(--ks-cizgi);
  background: var(--ks-zemin); color: var(--ks-yazi); transition: border-color .15s, background .15s; }
.ks-satir.bu-cihaz { border-color: color-mix(in srgb, var(--ks2) 50%, var(--ks-cizgi)); background: color-mix(in srgb, var(--ks2) 6%, var(--ks-zemin)); }
.ks-ikon { flex: 0 0 36px; width: 36px; height: 36px; border-radius: 11px; display: grid; place-items: center; color: var(--ks-vurgu-yazi);
  background: color-mix(in srgb, var(--ks2) 13%, var(--ks-zemin)); border: 1px solid color-mix(in srgb, var(--ks2) 24%, var(--ks-cizgi)); }
.ks-ikon svg { width: 19px; height: 19px; display: block; }
.ks-satir.pasif .ks-ikon { color: var(--ks-soluk); background: var(--ks-zemin-2); border-color: var(--ks-cizgi); }
.ks-metin { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; line-height: 1.25; }
.ks-metin b { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; font-size: .84rem; font-weight: 700; color: var(--ks-yazi); }
.ks-metin small { font-size: .7rem; font-weight: 600; color: var(--ks-soluk); margin-top: 1px; }
.ks-satir.pasif .ks-metin b { color: var(--ks-soluk); }
.ks-rozet { font-style: normal; font-size: .56rem; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; padding: 2px 7px; border-radius: 999px;
  color: var(--ks-vurgu-yazi); background: color-mix(in srgb, var(--ks2) 14%, transparent); }
.ks-btn { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: 36px; min-width: 84px; padding: 0 14px; border: 0; border-radius: 11px;
  background: var(--ks-zemin-btn, var(--ks2)); color: var(--ks-yazi-btn, #fff) !important; font: inherit; font-size: .8rem; font-weight: 700; text-decoration: none; cursor: pointer;
  box-shadow: 0 8px 18px -12px color-mix(in srgb, var(--ks2) 80%, transparent); transition: filter .15s, transform .12s; }
.ks-btn svg { width: 16px; height: 16px; flex: 0 0 16px; }
.ks-btn:hover, .ks-btn:focus-visible { filter: brightness(1.06); outline: none; }
.ks-btn:focus-visible { box-shadow: 0 0 0 3px color-mix(in srgb, var(--ks2) 35%, transparent); }
.ks-btn:active { transform: scale(.97); }
.ks-btn.yuklu { background: var(--ks-zemin-2); color: var(--ad-success-text, #067647) !important; border: 1px solid var(--ks-cizgi); box-shadow: none; cursor: default; filter: none; }
[data-bs-theme="dark"] .ks-btn.yuklu { color: var(--ad-success-text, #47cd89) !important; }
.ks-yakinda { flex: 0 0 auto; padding: 4px 10px; border-radius: 999px; border: 1px solid var(--ks-cizgi); background: var(--ks-zemin-2); color: var(--ks-soluk);
  font-size: .6rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; white-space: nowrap; }
/* kompakt (sağ alttaki küçük pencere) */
.ks-liste.kompakt { gap: 5px; }
.ks-liste.kompakt .ks-satir { min-height: 46px; padding: 5px 6px 5px 6px; border-radius: 12px; }
.ks-liste.kompakt .ks-ikon { flex-basis: 32px; width: 32px; height: 32px; border-radius: 10px; }
.ks-liste.kompakt .ks-ikon svg { width: 17px; height: 17px; }
.ks-liste.kompakt .ks-metin b { font-size: .8rem; }
.ks-liste.kompakt .ks-metin small { font-size: .66rem; }
.ks-liste.kompakt .ks-btn { height: 34px; min-width: 76px; padding: 0 12px; font-size: .76rem; }
@media (pointer: coarse) { .ks-btn, .ks-liste.kompakt .ks-btn { height: 40px; } }
@media (prefers-reduced-motion: reduce) { .ks-satir, .ks-btn { transition: none; } }