/* =====================================================================
 PROGRAMLAR — DadaFit liste/filtre sayfası (kütüphanenin program muadili)
 Chrome (token+topbar+header+drawer+bottom-nav+footer+modal+JS) hub'dan
 BİREBİR taşındı (egzersiz-kutuphane-v1.html). DadaFit recolor: --fit → #009d4f.
 Sayfa içeriği "SAYFA CSS" altına eklendi. Mega menü/chrome KİLİTLİ.
 ===================================================================== */

/* =====================================================================
 SAYFA CSS — PROGRAMLAR
 ===================================================================== */
:root{
  --fit:var(--marka);          /* DadaFit aksanı (Pantone 7482 C) */
  --fit-deep:var(--marka-koyu);     /* hover / gradient ucu */
  --fit-tint:var(--marka-yikama-2);     /* yumuşak yeşil yıkama */
  --fit-line:var(--marka-cizgi);     /* yeşil-nötr hairline */
  --fit-bright:var(--marka-parlak);   /* koyu zeminde okunur aksan metni */
  --fit-dark:#211E16;     /* vurgu/hero zemini */
}
.sec-fit .eyebrow{color:var(--fit-deep)}
.sec-fit .eyebrow::before{background:var(--fit)}

/* ---- ÜST PANEL: koyu band + breadcrumb + başlık + arama (kütüphane lib-top deseni) ---- */
.lib-top{
  position:relative;overflow:hidden;margin-top:112px;
  background:
    radial-gradient(820px 360px at 84% 14%,color-mix(in srgb, var(--marka) 20%, transparent),transparent 62%),
    linear-gradient(90deg,rgba(33,30,22,.94) 0%,rgba(29,26,20,.82) 46%,rgba(27,25,19,.74) 100%),
    linear-gradient(180deg,rgba(33,30,22,0) 58%,rgba(24,22,16,.62) 100%),
    url('https://images.unsplash.com/photo-1518611012118-696072aa579a?w=1680&q=80&auto=format&fit=crop&exp=7&gam=6&sat=-16') center 28%/cover no-repeat,
    #1b1913;
  padding:40px 0 38px;
}
.lib-top .wrap{position:relative;z-index:2}
.lib-crumb{display:flex;align-items:center;gap:9px;font-size:12.5px;font-weight:600;color:rgba(255,255,255,.6);margin-bottom:18px}
.lib-crumb a{color:rgba(255,255,255,.6);transition:color .2s var(--ease)}
.lib-crumb a:hover{color:#fff}
.lib-crumb i{font-size:9px;color:rgba(255,255,255,.34)}
.lib-crumb .cur{color:var(--fit-bright)}
.lib-top .eyebrow{color:var(--fit-bright)}
.lib-top .eyebrow::before{background:var(--fit-bright)}
.lib-top h1{color:#fff;font-size:39px;letter-spacing:-.02em;margin:14px 0 10px;max-width:680px}
.lib-top .lib-sub{color:rgba(255,255,255,.78);font-size:15.5px;font-weight:500;max-width:560px;line-height:1.55}
/* arama input — cam panel */
.lib-search{
  display:flex;align-items:center;gap:12px;margin-top:24px;max-width:520px;
  background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  border-radius:var(--radius-md);padding:4px 4px 4px 18px;
  transition:border-color .2s var(--ease),background .2s var(--ease);
}
.lib-search:focus-within{border-color:var(--fit-bright);background:rgba(255,255,255,.14)}
.lib-search i{color:rgba(255,255,255,.62);font-size:15px;flex:none}
.lib-search input{
  flex:1;min-width:0;background:none;border:none;outline:none;
  font-family:inherit;font-size:14.5px;font-weight:500;color:#fff;padding:11px 0;
}
.lib-search input::placeholder{color:rgba(255,255,255,.5)}
.lib-search button{
  flex:none;font-family:inherit;font-size:13.5px;font-weight:700;color:#fff;
  background:var(--fit);border:none;border-radius:var(--radius-sm);padding:0 18px;height:42px;cursor:pointer;
  transition:background .2s var(--ease);
}
.lib-search button:hover{background:var(--fit-deep)}
/* üst panel hızlı istatistik şeridi */
.lib-stats{display:flex;align-items:center;gap:26px;margin-top:24px;flex-wrap:wrap}
.lib-stat{display:flex;align-items:baseline;gap:8px}
.lib-stat b{font-size:20px;font-weight:800;color:#fff;letter-spacing:-.01em}
.lib-stat span{font-size:12.5px;font-weight:600;color:rgba(255,255,255,.62)}

/* ---- FİLTRE RAYI (sticky) — df-fchip dili ---- */
.lib-body{padding:var(--sec-pad-sm) 0 var(--sec-pad);background:var(--bg-white)}
.lib-filters{
  position:sticky;top:112px;z-index:40;
  background:rgba(255,255,255,.92);
  -webkit-backdrop-filter:saturate(150%) blur(8px);backdrop-filter:saturate(150%) blur(8px);
  border:1px solid var(--line);border-radius:var(--radius-lg);
  padding:18px 20px 16px;margin-bottom:28px;box-shadow:var(--sh-sm);
}
.fgroup{display:flex;align-items:center;flex-wrap:wrap;gap:9px;padding:7px 0}
.fgroup+.fgroup{border-top:1px solid var(--line);margin-top:3px;padding-top:13px}
.fgroup .lbl{
  font-size:11.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  color:var(--muted);min-width:96px;flex:none;
}
.df-fchip{font-size:13px;font-weight:600;color:var(--slate);background:var(--paper);border:1px solid var(--line);padding:9px 16px;border-radius:var(--radius-sm);cursor:pointer;transition:.18s var(--ease);display:inline-flex;align-items:center;gap:7px}
.df-fchip i{font-size:12px;opacity:.8}
.df-fchip:hover{border-color:var(--fit);color:var(--fit-deep);background:var(--fit-tint)}
.df-fchip.on{border-color:var(--fit);color:#fff;background:var(--fit)}
.df-fchip.on i{opacity:1}
/* filtre rayı alt aksiyonu — temizle */
.fclear{
  margin-left:auto;font-size:12.5px;font-weight:700;color:var(--muted);
  background:none;border:none;cursor:pointer;display:inline-flex;align-items:center;gap:7px;
  padding:9px 6px;transition:color .2s var(--ease);
}
.fclear:hover{color:var(--fit-deep)}

/* ---- SONUÇ ÇUBUĞU: sayı + sıralama ---- */
.lib-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:22px;flex-wrap:wrap}
.lib-count{font-size:14px;font-weight:600;color:var(--slate-2)}
.lib-count b{color:var(--slate);font-weight:800}
.lib-sort{display:flex;align-items:center;gap:8px}
.lib-sort .lbl{font-size:12.5px;font-weight:600;color:var(--muted)}
.sort-seg{display:inline-flex;background:var(--bg);border:1px solid var(--line);border-radius:var(--radius-md);padding:3px}
.sort-seg button{
  font-family:inherit;font-size:13px;font-weight:700;color:var(--slate-2);
  background:none;border:none;border-radius:var(--radius-sm);padding:8px 15px;cursor:pointer;
  transition:.18s var(--ease);
}
.sort-seg button:hover{color:var(--fit-deep)}
.sort-seg button.on{background:var(--fit);color:#fff}

/* ---- PROGRAM KART GRID'İ — full-görsel kart (hub-card / ex-card dili) ---- */
.lib-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.pr-media{position:relative;height:210px;background-size:cover;background-position:center}
.pr-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(33,30,22,0) 40%,rgba(20,18,12,.66))}
/* hedef rozeti (sol üst) */
.pr-goal{position:absolute;top:12px;left:12px;z-index:2;background:var(--fit);color:#fff;font-size:11.5px;font-weight:700;padding:6px 12px;border-radius:var(--radius-sm);letter-spacing:.02em}
/* Pro etiketi (sol üst, hedef altına) */
.pr-pro{position:absolute;top:46px;left:12px;z-index:2;display:inline-flex;align-items:center;gap:6px;background:rgba(20,18,12,.78);color:#ffd97a;font-size:11px;font-weight:700;padding:5px 11px;border-radius:var(--radius-sm);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
/* seviye rozeti (sağ üst) — yoğunluk pip'leri (aksan SADECE #009d4f) */
/* ZORLUK ROZETİ SAĞ ALTA TAŞINDI (R16/1).
   ÖLÇÜLEN KUSUR: rozet `top:12px;right:12px`teydi ve kaydet düğmesi
   (`.kyt-btn`, `top:8px;right:8px`, 44×44) R15'te tam oraya eklendi.
   Üst üste bindiler: kesişim **1162 px²**, üç genişlikte de (1440·1024·390),
   bu sayfada 12 kartın 12'sinde. Düğme z-index 4'te olduğu için rozetin
   üstünü kapatıyordu — seviye okunmuyordu.
   Sağ alt köşe boştu (sol altta `.pr-tags` var), rozet oraya alındı.
   Kural artık kitte: docs/fit-kit.md §12 · kart üstü öğe yerleşimi. */
.pr-level{position:absolute;bottom:12px;right:12px;z-index:2;display:inline-flex;align-items:center;gap:7px;background:rgba(255,255,255,.94);color:var(--slate);font-size:11px;font-weight:700;padding:6px 11px;border-radius:var(--radius-sm)}
.pr-pips{display:inline-flex;gap:3px}
.pr-pips i{width:6px;height:6px;border-radius:50%;background:#d6dad7;display:block}
.pr-level.lv1 .pr-pips i:nth-child(-n+1),
.pr-level.lv2 .pr-pips i:nth-child(-n+2),
.pr-level.lv3 .pr-pips i:nth-child(-n+3){background:var(--fit)}
/* DAR KOLONDA ROZET ALT SOLA, ETİKETLERİN ÜSTÜNE GEÇER (R16/1).
   ÖLÇÜM (768 px, kart ızgarası 3 kolon): görsel genişliği 346 px, en geniş
   `.pr-level` 103 px, en geniş `.pr-tags` 173 px. 103 + 173 + iki kenar
   boşluğu, 222 px'e SIĞMIYOR — yan yana durmaları geometrik olarak
   imkânsız, o yüzden burada bir hizalama ayarı değil bir YERLEŞİM
   değişikliği gerekiyor. Rozet alt sola, etiketlerin bir sıra üstüne
   çıkar; ikisi de tam okunur, hiçbir bilgi gizlenmez.
   1440 ve 1024'te yan yana sığıyor (ölçüldü: çakışma 0), orada
   değişiklik yok. */
@media (min-width:641px) and (max-width:900px){
  .pr-level{left:12px;right:auto;bottom:46px}
}

/* alt etiketler: süre + ekipman */
.pr-tags{position:absolute;bottom:12px;left:12px;z-index:2;display:flex;gap:6px;flex-wrap:wrap}
.pr-tag{display:inline-flex;align-items:center;gap:6px;background:rgba(20,18,12,.72);color:#fff;font-size:11px;font-weight:700;padding:6px 10px;border-radius:var(--radius-sm);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.pr-tag i{font-size:11px}
.pr-body{padding:16px 18px 18px;display:flex;flex-direction:column;flex:1}
.pr-body h3{font-size:17px;margin-bottom:6px;letter-spacing:-.01em;transition:color .2s var(--ease)}
.pr-card:hover .pr-body h3{color:var(--fit-deep)}
.pr-body p{font-size:13px;color:var(--muted);font-weight:500;line-height:1.5}
/* SÜRE OMURGASI — programı egzersizden ayıran imza: hafta noktaları + plan özeti.
 Program = haftalara yayılan sıra; bu satır o sırayı görselleştirir. */
.pr-spine{display:flex;align-items:center;gap:5px;margin-top:14px}
.pr-week{flex:1;height:5px;border-radius:var(--radius-sm);background:#e7eae6;transition:background .2s var(--ease)}
.pr-week.fill{background:var(--fit)}
.pr-card:hover .pr-week.fill{background:var(--fit-deep)}
.pr-plan{display:flex;align-items:center;gap:7px;margin-top:11px;font-size:12px;color:var(--slate-2);font-weight:600}
.pr-plan i{color:var(--fit-deep);font-size:12px}
.pr-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:16px;padding-top:14px;border-top:1px solid var(--line);font-size:12.5px;color:var(--muted);font-weight:500}
.pr-foot .meta{display:inline-flex;align-items:center;gap:6px}
.pr-foot .go{display:inline-flex;align-items:center;gap:7px;color:var(--fit-deep);font-weight:700}
.pr-foot .go i{transition:transform .2s var(--ease)}
.pr-card:hover .pr-foot .go i{transform:translateX(3px)}

/* ---- DAHA FAZLA YÜKLE ---- */
.lib-more{display:flex;flex-direction:column;align-items:center;gap:14px;margin-top:40px}
.lib-more .btn-more{
  display:inline-flex;align-items:center;gap:10px;font-family:inherit;font-size:14.5px;font-weight:700;
  color:var(--slate);background:var(--paper);border:1px solid var(--line);border-radius:var(--radius-md);
  padding:14px 30px;cursor:pointer;transition:.22s var(--ease);
}
.lib-more .btn-more:hover{border-color:var(--fit);color:var(--fit-deep);transform:translateY(-2px)}
.lib-more .btn-more i{color:var(--fit)}
.lib-more .more-note{font-size:12.5px;font-weight:500;color:var(--muted)}

/* boş durum (filtre eşleşmezse) */
.lib-empty{display:none;flex-direction:column;align-items:center;text-align:center;padding:54px 20px}
.lib-empty.show{display:flex}
.lib-empty .ico{width:62px;height:62px;border-radius:var(--radius-circle);background:var(--fit-tint);color:var(--fit-deep);display:grid;place-items:center;font-size:24px;margin-bottom:16px}
.lib-empty h3{font-size:18px;margin-bottom:7px}
.lib-empty p{font-size:13.5px;color:var(--muted);font-weight:500;max-width:340px;margin-bottom:18px}

/* ===================== SAYFA RESPONSIVE ===================== */
@media (max-width:1024px){
  .lib-top{margin-top:112px}
  .lib-filters{top:112px}
  .lib-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .lib-top h1{font-size:33px}
  .fgroup .lbl{min-width:88px}
}
@media (max-width:760px){
  .lib-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:640px){
  .lib-top{margin-top:62px;padding:30px 0 30px}
  .lib-top h1{font-size:27px}
  .lib-top .lib-sub{font-size:14px}
  .lib-search{max-width:none}
  .lib-stats{gap:18px;margin-top:20px}
  .lib-stat b{font-size:18px}
  .lib-body{padding:var(--sec-pad-sm) 0 var(--sec-pad)}
  /* sticky filtre bar mobilde tek satır yatay kaydır */
  .lib-filters{top:62px;padding:14px 14px 12px}
  .fgroup{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-bottom:5px}
  .fgroup::-webkit-scrollbar{display:none}
  .fgroup .lbl{position:sticky;left:0;background:rgba(255,255,255,.96);min-width:auto;padding-right:6px;z-index:1}
  .df-fchip{flex:none;white-space:nowrap}
  .fclear{flex:none}
  .lib-bar{margin-bottom:18px}
  .lib-sort{width:100%;justify-content:space-between}
  .sort-seg button{padding:8px 12px;font-size:12.5px}
  .lib-grid{grid-template-columns:1fr;gap:16px}
  .pr-media{height:194px}
  .pr-body{padding:14px 15px 16px}
  .pr-body h3{font-size:16px}
}
@media (max-width:400px){
  .lib-grid{grid-template-columns:1fr}
  .pr-media{height:200px}
}

/* ---- gaviaworks imza code-mark ---- */

/* breadcrumb root ev ikonu — koyu band üstünde okunur (chevron .34'ten ayrışsın) */
.lib-crumb a i.fa-house{color:rgba(255,255,255,.72)}
.lib-crumb a:hover i.fa-house{color:#fff}

/* ============ ADIM 3 — KABUK: brand-switch band (Fit, .bs-fit aktif) ============ */
/* NOT: .bs-gastro --bs-c LİTERAL #E14827 — bu sayfada --fit YEŞİL'e swap'lı (Fit aksanı),
 var(--fit) kullanılsaydı Gastro pill'i yeşil render olurdu. Diğer markalar page-bağımsız token. */

/* ============ SPONSORLU BLOK MAKETİ (FIT-LB, docs/reklam-envanteri-fit.json) ============
 GERÇEK REKLAM KATMANI DEĞİL — statik prototip maketi. Backend/admin/veri katmanı yok,
 bu blok yalnız yerleşimin nasıl duracağını gösterir (bkz. sayfa içindeki "MAKET" yorumu).
 .lib-bar (sonuç çubuğu) ile .lib-grid (organik program ızgarası) arasına, kendi başlıklı
 ve etiketli AYRI bir blok olarak oturur — organik kartların İÇİNE karışmaz (D-03 + D-06). */
.spons-slot{
  display:flex;align-items:center;gap:18px;flex-wrap:wrap;
  border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--paper);
  box-shadow:var(--sh-sm);padding:18px 22px;margin-bottom:24px;
}
.spons-slot .eyebrow{margin:0;color:var(--fit-deep)}
.spons-slot-fig{
  flex:none;width:120px;height:60px;border-radius:var(--radius-md);
  background:var(--fit-tint);display:grid;place-items:center;color:var(--fit-deep);font-size:22px;
}
.spons-slot-body{flex:1;min-width:0}
.spons-slot-body h3{font-size:15.5px;margin:6px 0 3px}
.spons-slot-body p{font-size:13px;color:var(--muted);font-weight:500;margin:0}
.spons-slot-tag{
  flex:none;font-size:11px;font-weight:700;letter-spacing:.04em;color:var(--muted);
  border:1px dashed var(--line);border-radius:var(--radius-sm);padding:5px 10px;
}
@media (max-width:640px){
  .spons-slot{padding:16px 18px}
  .spons-slot-fig{width:100%;height:70px}
}