/* TurnuvaGo v6.21.0 — notification center and push controls */
/* Üst çubuk zili — v3 turnuva kabuğu, Hesabım kabuğu ve eski kabuk ORTAK kullanır (değişmedi). */
.notification-topbar-link{position:relative;display:grid;place-items:center;width:var(--tg-topbar-action-size);height:var(--tg-topbar-action-size);flex:0 0 var(--tg-topbar-action-size);box-sizing:border-box;border:1px solid var(--tg-border);border-radius:var(--tg-topbar-action-radius);background:var(--tg-surface);color:var(--tg-text)}.notification-topbar-link svg{width:17px;height:17px}.notification-topbar-link b{position:absolute;right:-4px;top:-5px;display:grid;place-items:center;min-width:18px;height:18px;padding:0 4px;border:2px solid #fff;border-radius:999px;background:#e23c48;color:#fff;font-size:10px}
@media(max-width:760px){.notification-topbar-link{width:var(--tg-topbar-action-size);height:var(--tg-topbar-action-size)}}

/*
 * BİLDİRİM MERKEZİ (notifications.php) — UX_ARCHITECTURE §15.13 K5 / §15.41.
 *
 * Hesabım kabuğunda iki canonical sekme (DS-092): Bildirimler · Tercihler.
 * BU BİR TASARIM SİSTEMİ DEĞİLDİR: kart (`.tg-card`), sekme (`.tg-tabbar`),
 * buton (`.tg-btn`) ve not (`.tg-note`) canonical'dır; burada yalnız ekranın
 * YERLEŞİMİ vardır. Renkler semantik token'dan gelir (hardcoded renk yok).
 * Mobil önce (360/390px); masaüstünde aynı DOM, yalnız cihaz kartı yatay dizilir.
 */
.notification-center{display:grid;gap:var(--tg-space-3);width:100%;max-width:820px;margin:0 auto;min-width:0}
/* `hidden` her zaman kazanır: paneller ve cihaz butonları display taşıyan sınıflara sahip. */
.notification-center [hidden]{display:none!important}
.notification-center .notification-center-header,.notification-center .notification-center-tabbar{margin:0}
.notification-center-tabbar .tg-canonical-tab{gap:6px}
.notification-center-tabbar .tg-canonical-tab svg{flex:0 0 auto}
.notification-center-pane{display:grid;gap:var(--tg-space-3);min-width:0}
.notification-center-pane:focus{outline:0}
.notification-center-pane:focus-visible{outline:2px solid var(--tg-focus-ring);outline-offset:2px;border-radius:var(--tg-radius-lg)}

/* ── Bildirimler: liste ───────────────────────────────────────────── */
.notification-inbox{margin:0}
.notification-inbox>.tg-card-head{align-items:center;background:var(--tg-surface)}
.notification-inbox .tg-card-head-actions form{margin:0}
.notification-inbox .tg-card-head-actions .tg-btn{gap:6px;white-space:nowrap}
.notification-list{display:grid;margin:0;padding:0;list-style:none}
.notification-item{position:relative;display:grid;grid-template-columns:36px minmax(0,1fr) 18px;align-items:start;gap:var(--tg-space-3);
  padding:12px var(--tg-space-4);border-top:1px solid var(--tg-border);color:var(--tg-text)}
.notification-item:first-child{border-top:0}
.notification-item.is-unread{background:color-mix(in srgb,var(--tg-action-primary) 5%,var(--tg-surface))}
.notification-item.is-unread::before{content:"";position:absolute;top:0;bottom:0;left:0;width:3px;background:var(--tg-action-primary)}
.notification-item-icon{display:grid;place-items:center;width:36px;height:36px;border-radius:var(--tg-radius-md);background:var(--tg-surface-soft);color:var(--tg-text-muted)}
.notification-item.is-unread .notification-item-icon{background:var(--tg-action-primary-soft);color:var(--tg-action-primary)}
.notification-item.is-high .notification-item-icon{background:var(--tg-status-danger-soft);color:var(--tg-status-danger)}
.notification-item-content{display:grid;gap:2px;min-width:0}
.notification-item-link{display:block;color:var(--tg-text);font-size:var(--tg-font-md);font-weight:var(--tg-font-weight-bold);line-height:1.35;
  text-decoration:none;overflow-wrap:anywhere}
.notification-item.is-unread .notification-item-link{font-weight:var(--tg-font-weight-black)}
/* Satırın tamamı ilgili sayfaya gider: başlık bağlantısının görünmez katmanı
   satırı kaplar. Erişilebilir ad yalnız başlıktır; odak halkası satıra çizilir. */
.notification-item-link::after{content:"";position:absolute;inset:0;border-radius:inherit}
.notification-item-link:focus-visible{outline:0;box-shadow:none}
.notification-item-link:focus-visible::after{outline:2px solid var(--tg-focus-ring);outline-offset:-2px}
.notification-unread-dot{display:inline-block;width:8px;height:8px;margin:0 6px 2px 0;border-radius:50%;background:var(--tg-action-primary);vertical-align:middle}
.notification-item-body{margin:0;color:var(--tg-text-muted);font-size:var(--tg-font-sm);line-height:1.4;overflow-wrap:anywhere}
.notification-item-meta{display:flex;flex-wrap:wrap;align-items:center;gap:2px 8px;margin:2px 0 0;color:var(--tg-text-muted);font-size:var(--tg-font-xs);line-height:1.4}
.notification-item-tournament{min-width:0;max-width:100%;font-weight:var(--tg-font-weight-bold);overflow-wrap:anywhere}
.notification-item-meta time{white-space:nowrap}
.notification-item-chevron{align-self:center;display:grid;place-items:center;color:var(--tg-text-muted)}
@media(hover:hover){.notification-item:hover{background:var(--tg-surface-soft)}.notification-item:hover .notification-item-chevron{color:var(--tg-action-primary)}}
.notification-empty{display:grid;justify-items:center;gap:6px;padding:28px var(--tg-space-4);text-align:center}
.notification-empty-icon{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--tg-surface-soft);color:var(--tg-text-muted)}
.notification-empty strong{font-size:var(--tg-font-md)}
.notification-empty p{margin:0;color:var(--tg-text-muted);font-size:var(--tg-font-sm)}
.notification-empty .tg-btn{margin-top:var(--tg-space-2)}
.notification-load-error .notification-empty-icon{background:var(--tg-status-warning-soft);color:var(--tg-status-warning)}

/* ── Bildirimlerim: Tümü / Okunmamış süzgeci + Daha yeni / Daha eski (BILDIRIM-FAZ-2A) ──
   Canonical buton (`.tg-btn`, 44 px kontrol yüksekliği); seçili süzgeç `aria-current` ile duyurulur. Segmented
   control için canonical sınıf yok (DS-040) — burada yalnız yerleşim ve seçili görünüm vardır. */
.notification-filter{display:flex;flex-wrap:wrap;gap:var(--tg-space-2);padding:var(--tg-space-3) var(--tg-space-4);border-bottom:1px solid var(--tg-border)}
.notification-filter-link{gap:6px;min-width:0}
.notification-filter-link.is-active{background:var(--tg-action-primary-soft);border-color:var(--tg-action-primary);color:var(--tg-action-primary)}
.notification-filter-count{display:inline-grid;place-items:center;min-width:22px;height:22px;padding:0 6px;border-radius:999px;
  background:var(--tg-action-primary);color:var(--tg-action-primary-text);font-size:var(--tg-font-xs);line-height:1}
.notification-paging{display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--tg-space-2);padding:var(--tg-space-3) var(--tg-space-4);border-top:1px solid var(--tg-border)}
.notification-paging .tg-btn{gap:4px}
.notification-paging-older{margin-left:auto}
@media(max-width:599px){.notification-filter-link{flex:1 1 0}.notification-paging .tg-btn{flex:1 1 0}}

/* ── Tercihler: bu cihaz ──────────────────────────────────────────── */
.notification-device{display:grid;grid-template-columns:40px minmax(0,1fr);align-items:start;gap:var(--tg-space-3);margin:0;padding:var(--tg-space-4)}
.notification-device-icon{display:grid;place-items:center;width:40px;height:40px;border-radius:var(--tg-radius-md);background:var(--tg-surface-soft);color:var(--tg-text-muted)}
.notification-device[data-push-state="on"] .notification-device-icon{background:var(--tg-status-success-soft);color:var(--tg-status-success)}
.notification-device[data-push-state="off"] .notification-device-icon{background:var(--tg-action-primary-soft);color:var(--tg-action-primary)}
.notification-device[data-push-state="denied"] .notification-device-icon,
.notification-device[data-push-state="unavailable"] .notification-device-icon{background:var(--tg-status-warning-soft);color:var(--tg-status-warning)}
.notification-device-copy{display:grid;gap:2px;min-width:0}
.notification-device-eyebrow{margin:0;color:var(--tg-text-muted);font-size:var(--tg-font-xs);font-weight:var(--tg-font-weight-black);letter-spacing:.06em;line-height:1.3;text-transform:uppercase}
.notification-device-title{display:block;color:var(--tg-text);font-size:var(--tg-font-md);font-weight:var(--tg-font-weight-black);line-height:1.3;overflow-wrap:anywhere}
.notification-device-text{margin:2px 0 0;color:var(--tg-text-muted);font-size:var(--tg-font-sm);line-height:1.4;overflow-wrap:anywhere}
.notification-device-text:empty{display:none}
.notification-device-count{margin:4px 0 0;color:var(--tg-text-muted);font-size:var(--tg-font-xs);line-height:1.4}
.notification-device-actions{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:var(--tg-space-2)}
/* Görünür buton yoksa (açık-değil/engelli/desteklenmiyor) satır yer kaplamaz. */
.notification-device-actions:not(:has(.tg-btn:not([hidden]))){display:none}
.notification-device-actions .tg-btn{flex:1 1 auto}
@media(min-width:600px){
  .notification-device{grid-template-columns:44px minmax(0,1fr) auto;align-items:center}
  .notification-device-icon{width:44px;height:44px}
  .notification-device-actions{grid-column:auto}
  .notification-device-actions .tg-btn{flex:0 0 auto}
}

/* ── Tercihler: bildirim türleri ──────────────────────────────────── */
.notification-preferences{margin:0}
.notification-preferences>.tg-card-head{background:var(--tg-surface)}
.notification-preferences-form{display:grid;gap:var(--tg-space-3);margin:0;padding:var(--tg-space-2) var(--tg-space-4) var(--tg-space-4)}
.notification-preference-list{display:grid;margin:0;padding:0;list-style:none}
.notification-preference-list li+li{border-top:1px solid var(--tg-border)}
.notification-preference{display:flex;align-items:center;gap:12px;min-height:var(--tg-touch-min,44px);margin:0;padding:6px 0;
  color:var(--tg-text);font-size:var(--tg-font-sm);line-height:1.35;cursor:pointer}
.notification-preference input{flex:0 0 auto;width:20px;height:20px;margin:0;accent-color:var(--tg-action-primary)}
.notification-preference span{min-width:0;overflow-wrap:anywhere}
.notification-preferences-actions{display:flex;justify-content:flex-end}
@media(max-width:599px){.notification-preferences-actions .tg-btn{width:100%}}
/* BILDIRIM-FAZ-2B: kutunun anlamı (yalnız telefon) listenin üstünde bir kez söylenir; eski tamamen kapalı türler ayrı blokta. */
.notification-preference-legend{margin:0;color:var(--tg-text-muted);font-size:var(--tg-font-xs);font-weight:700;letter-spacing:.02em}
.notification-legacy{display:grid;gap:var(--tg-space-2);margin:0;padding:var(--tg-space-3) var(--tg-space-4) var(--tg-space-4);border-top:1px solid var(--tg-border)}
.notification-legacy-title{margin:0;color:var(--tg-text);font-size:var(--tg-font-sm);font-weight:700;line-height:1.3}
.notification-legacy-text{margin:0;color:var(--tg-text-muted);font-size:var(--tg-font-sm);line-height:1.45}
.notification-legacy-list{display:grid;margin:0;padding:0;list-style:none}
.notification-legacy-list li+li{border-top:1px solid var(--tg-border)}
.notification-legacy-item{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:var(--tg-touch-min,44px);padding:6px 0}
.notification-legacy-name{min-width:0;color:var(--tg-text);font-size:var(--tg-font-sm);line-height:1.35;overflow-wrap:anywhere}
.notification-legacy-item form{flex:0 0 auto;margin:0}
.notification-legacy-item .tg-btn{min-height:var(--tg-touch-min,44px)}
@media(max-width:599px){
  .notification-legacy-item{flex-wrap:wrap}
  .notification-legacy-item form,.notification-legacy-item .tg-btn{width:100%}
}
.notification-test{display:grid;justify-items:start;gap:var(--tg-space-2)}
.notification-test form{margin:0}
.notification-test .tg-note{margin:0}
