/* ===========================================================================
   RSS BESLEMELERI SAYFASI (09.09.2026, Ozgur - Claude Design handoff
   "Oyuneks RSS")

   Sayfa kurumsal sol menu kabugunun DISINDA, tam genislikte basilir
   (master.blade.php istisnasi); ustte kurumsal sekme seridi
   (css/kurumsal-sekmeler.css, --ku* tokenlar). Icerik sitenin .container'ina
   (1550px) oturur; tuvaldeki 1920/100px kenar bosluklari yerine header ile
   ayni hiza. Yazi tipi sitenin kendi fontu (Wix Madefor Display).

   Eski sayfa 258px sol menu + 4 kolonlu table.rssTablo (mobilde Icerik kolonu
   gizleniyor, yatay kaydirma) + uc h2/p bloguydu; CSS blade icinde inline idi.
   Yeni kurgu: baslik + "30 dakikada tazelenir" bilgi kutusu -> 5 besleme SATIR
   KARTI (ikon, ad + aciklama, kalem sayisi, adres + kopyala + ac) -> Kullanim
   3 kart. Metin eklenmedi/cikarilmadi; giris paragrafinin son cumlesi bilgi
   kutusuna tasindi. Satir ici <code> Bootstrap pembesi yerine nane.
   =========================================================================== */
.rsSayfa {
    --rsRozetKenar: rgba(128,241,177,.30);
    --rsRozetMetin: var(--kuNane);
    --rsKodZemin: #111117;              /* adres kutusu + satir ici code zemini */
    --rsKodMetin: var(--kuNane);
    color: var(--kuMetin); padding-bottom: 80px;
}
body.light .rsSayfa {
    --rsRozetKenar: rgba(19,126,76,.30);
    --rsRozetMetin: #0F6B3F;            /* README kontrast: tint/#F0EEE6 zeminde #137E4C 4.5:1 altinda */
    --rsKodZemin: #F0EEE6;
    --rsKodMetin: #0F6B3F;
}
.rsSayfa a { color: var(--kuNane); }
.rsSayfa a:hover { color: var(--kuNaneHover); }
.rsSayfa > .container { display: flex; flex-direction: column; gap: 40px; padding-top: 48px; }
.rsSayfa svg { display: block; flex: none; }
.rsSayfa h1, .rsSayfa h2, .rsSayfa h3, .rsSayfa p { margin: 0; }
.rsSayfa button { font-family: inherit; }

/* ---- Baslik satiri: sol rozet + h1 + giris | sag "30 dakikada tazelenir" kutusu ---- */
.rsBas { display: flex; align-items: flex-end; justify-content: space-between; gap: 40px; }
.rsBasMetin { display: flex; flex-direction: column; gap: 13px; max-width: 820px; }
.rsRozet {
    display: inline-flex; align-items: center; gap: 8px; align-self: flex-start; height: 30px; padding: 0 13px 0 10px;
    border-radius: 999px; background: var(--kuNaneZemin); border: 1px solid var(--rsRozetKenar);
    font-size: 11px; font-weight: 800; letter-spacing: 1.1px; text-transform: uppercase; color: var(--rsRozetMetin);
}
.rsRozet svg { width: 14px; height: 14px; color: var(--kuNane); }
.rsBas h1 { font-size: 44px; font-weight: 800; letter-spacing: -1.1px; line-height: 1.05; color: var(--kuBaslik); text-wrap: balance; }
.rsBasMetin p { font-size: 15px; line-height: 1.65; color: var(--kuUcuncul); text-wrap: pretty; }
.rsTazele {
    flex: none; display: flex; align-items: center; gap: 10px; padding: 13px 16px; border-radius: 12px;
    background: var(--kuKart); border: 1px solid var(--kuKenar); box-shadow: var(--kuKartGolge);
    font-size: 12.5px; color: var(--kuGovde);
}
.rsTazele svg { width: 15px; height: 15px; color: var(--kuNane); }
.rsTazele b { color: var(--kuMetin); font-weight: 700; }

/* ---- Bolum basligi: 19/800 + saga cizgi (+ sagda sayi) ---- */
.rsBolum { display: flex; flex-direction: column; gap: 12px; }
.rsBolumBas { display: flex; align-items: center; gap: 16px; padding: 0 2px 2px; }
.rsBolumBas h2 { font-size: 19px; font-weight: 800; letter-spacing: -.4px; line-height: 1.2; color: var(--kuBaslik); white-space: nowrap; }
.rsBolumBas .rsCizgi { flex: 1; height: 1px; background: var(--kuNaneKenar); }
.rsBolumBas .rsSayi { flex: none; font-size: 12px; color: var(--kuUcuncul); }

/* ---- Besleme satir karti ---- */
.rsKart { background: var(--kuKart); border: 1px solid var(--kuKenar); border-radius: 14px; box-shadow: var(--kuKartGolge); }
.rsBesleme { display: flex; align-items: center; gap: 18px; padding: 18px 20px; transition: border-color .16s; }
.rsBesleme:hover { border-color: var(--kuNaneKenarHover); }
.rsBeslemeIkon {
    flex: none; width: 44px; height: 44px; border-radius: 12px; display: flex; align-items: center; justify-content: center;
    background: var(--kuNaneZemin); border: 1px solid var(--kuNaneKenar); color: var(--kuNane);
}
.rsBeslemeIkon svg { width: 20px; height: 20px; }
.rsBeslemeMetin { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.rsBeslemeMetin h3 { font-size: 15px; font-weight: 800; letter-spacing: -.2px; line-height: 1.3; color: var(--kuBaslik); }
.rsBeslemeMetin p { font-size: 13px; line-height: 1.55; color: var(--kuUcuncul); text-wrap: pretty; }
.rsKalem { flex: none; display: flex; flex-direction: column; align-items: flex-end; gap: 2px; min-width: 92px; }
.rsKalem b { font-size: 19px; font-weight: 800; letter-spacing: -.3px; line-height: 1.2; color: var(--kuMetin); font-variant-numeric: tabular-nums; }
.rsKalem span { font-size: 10px; font-weight: 700; letter-spacing: .9px; text-transform: uppercase; color: var(--kuUcuncul); }
.rsEylemler { flex: none; display: flex; align-items: center; gap: 8px; }
.rsSayfa a.rsAdres {
    display: flex; align-items: center; height: 40px; padding: 0 13px; border-radius: 9px;
    background: var(--rsKodZemin); border: 1px solid var(--kuKenar);
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 13px; color: var(--rsKodMetin); white-space: nowrap;
    transition: border-color .16s;
}
.rsSayfa a.rsAdres:hover { border-color: var(--kuNane); color: var(--rsKodMetin); }
.rsSayfa .rsBtn {
    width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; border-radius: 9px;
    border: 1px solid var(--kuKenarBelirgin); background: var(--kuKart); color: var(--kuGovde); cursor: pointer; padding: 0;
    transition: background .16s, border-color .16s, color .16s;
}
.rsSayfa .rsBtn:hover { background: var(--kuKartHover); border-color: var(--kuNane); color: var(--kuMetin); }
.rsSayfa .rsBtn:focus-visible, .rsSayfa a.rsAdres:focus-visible { outline: 2px solid var(--kuNane); outline-offset: 2px; }
.rsSayfa .rsBtn svg { width: 16px; height: 16px; }
.rsSayfa .rsBtn.ac svg { width: 15px; height: 15px; }
/* Kopyalandi: 1,5 sn nane onay isareti (JS .kopyalandi sinifi) */
.rsSayfa .rsBtn .rsOnay { display: none; color: var(--kuNane); }
.rsSayfa .rsBtn.kopyalandi .rsKopya { display: none; }
.rsSayfa .rsBtn.kopyalandi .rsOnay { display: block; }
.rsSayfa .rsBtn.kopyalandi { border-color: var(--kuNane); }

/* ---- Kullanim: 3 kart ---- */
.rsKullanim { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.rsBilgi { display: flex; flex-direction: column; gap: 11px; padding: 20px; }
.rsBilgiBas { display: flex; align-items: center; gap: 11px; }
.rsBilgiIkon { flex: none; width: 34px; height: 34px; border-radius: 10px; display: flex; align-items: center; justify-content: center; background: var(--kuKartHover); color: var(--kuNane); }
.rsBilgiIkon svg { width: 16px; height: 16px; }
.rsBilgiBas h3 { font-size: 15.5px; font-weight: 800; letter-spacing: -.2px; line-height: 1.3; color: var(--kuBaslik); }
.rsBilgi p { font-size: 13.5px; line-height: 1.7; color: var(--kuMetin); text-wrap: pretty; }
.rsBilgi code {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 12.5px; padding: 2px 6px; border-radius: 5px;
    background: var(--rsKodZemin); color: var(--rsKodMetin);
}

/* ---- Mobil / tablet (<=991.98, kurumsal-sekmeler.css ile ayni kirilim) ---- */
@media (max-width: 991.98px) {
    .rsSayfa { padding-bottom: 48px; }
    .rsSayfa > .container { gap: 28px; padding-top: 24px; }
    .rsBas { flex-direction: column; align-items: stretch; gap: 14px; }
    .rsBasMetin { gap: 12px; max-width: none; }
    .rsBas h1 { font-size: 30px; letter-spacing: -.8px; line-height: 1.1; }
    .rsBasMetin p { font-size: 14px; }
    .rsBolumBas h2 { font-size: 18px; }
    /* besleme karti dikey: ikon -> ad/aciklama -> "1.894 KALEM" -> adres (esnek) + 44px butonlar */
    .rsBesleme { flex-direction: column; align-items: stretch; gap: 14px; padding: 16px; }
    .rsKalem { flex-direction: row; align-items: baseline; gap: 7px; min-width: 0; }
    .rsKalem b { font-size: 17px; }
    .rsEylemler { gap: 8px; }
    .rsSayfa a.rsAdres { flex: 1; min-width: 0; height: 44px; overflow: hidden; text-overflow: ellipsis; }
    .rsSayfa .rsBtn { width: 44px; height: 44px; }
    .rsKullanim { grid-template-columns: minmax(0, 1fr); gap: 12px; }
}