/* 2026-10-09 masaüstü 1200px genişlik — tüm sayfalarda yüklenir (mobilde yüklenmez; bkz. index.php)
   style.css'teki 980px düzeni bozulmadan genişletilir: ekran ve liste kutuları 485 -> 595px */

/* ortak kapsayıcılar */
.header .ic,
.nav .ic,
.div-canlitv .ic,
.div_ekran_alti,
.footer,
.kanal-reytigleri,
body .ai{width:1200px;} /* aktif-izleyiciler.css sonradan yüklendiği için body ile güçlendirildi */

/* ekran + kanal listesi; player alanı (.ekran) 576x324 = 16:9; kutular 340 -> 344px
   (2026-10-10: çerçeveler artık görsel değil CSS — aşağıda "çerçeveler") */
.div-canlitv{height:354px;}
.div_ekran{width:595px; height:344px;}
.ekran{height:324px;}
.div_liste{left:605px; width:593px; height:344px;}
.button_liste{width:196px;}
/* kanal listesi iç panele tam oturur (x 12-584, y 36-338) */
#kanal_liste{width:572px; height:302px;}
#kategoriler{width:auto;}                                /* liste içeriği boyunca (kaydırma çubuğu hariç) */
/* satır esnek: kanal adı kalan alanı doldurur (canlitv.js'in verdiği 255/248/240px satır içi genişlik taban olur),
   kategori / bayrak / favori sağa yaslanır */
#kanal_liste ul li{display:flex; padding-right:14px; line-height:25px; white-space:nowrap;}
#kanal_liste ul li a{flex:none; margin-left:4px;}
#kanal_liste ul li a:nth-child(1){flex:1 1 auto; min-width:0; margin-left:5px; overflow:hidden; text-overflow:ellipsis;}

/* ekran altı iki sütun: 480 -> 590 */
.kanal-bilgi-sol,
.kanal-bilgi-sag{width:590px;}
.sitene_ekle_input{width:583px;} /* kanal sayfası "sitene ekle" kutusu */

/* kenardaki sabit 160x600 reklamlar içerikle çakışmasın */
#reklam_sabit_sag{margin-left:610px;}
#reklam_sabit_sol{margin-right:610px;}

/* ana sayfa Kanal Reytingleri: 14 sütun (modul-reyting-ek.php $rey_limit) 1200px'e yayılır, "tümünü göster" alta iner */
.kanal-reytigleri .tv-reyting-sutun{margin-left:9px;}
.kanal-reytigleri .reyting-bilgi-alt{clear:both; padding-top:6px; line-height:20px;}

/* alt sayfalar — sayfaya özel CSS'ler (sayfa.css, kanal-oner.css, yayin-akisi.css, haber.css) bu dosyadan sonra
   yüklendiği için seçiciler body ile güçlendirildi */
body table.tbl[width="980"]{width:1200px;}              /* kanal bilgileri, dosyalar, 404 */
body .sayfa-ortali{width:1200px;}                       /* rating, uydu frekansları */
body .reyting-butonlar li a{width:auto;}
body .sy:not(.sy-mobil), body .sy-yazilar-baslik{width:1200px;} /* iletişim, künye, gizlilik, yardım, yazarlar */
body .ko:not(.ko-mobil){width:1200px;}                  /* kanal öner */
body .ya:not(.ya-mobil){width:1200px;}                  /* yayın akışları */
body .hb-ic{max-width:1200px;}                          /* blog / haber / etiket */
.blog, .blog-ana, .sayfa-ic{width:1200px;}              /* yazar sayfası yazı listesi (#blog.blog) ve eski sayfa kapsayıcıları */
#blog_liste .detail{width:calc(100% - 322px);}          /* yazı kartı metni: 311px görsel + 10px aralıktan kalan alan (eski sabit 605px) */

/* dar pencerede kenar boşluklu akış (sayfa.css / kanal-oner.css'teki 1000px kırılımının 1200px karşılığı) */
@media (max-width:1224px){
	body .sy:not(.sy-mobil), body .sy-yazilar-baslik, body .ko:not(.ko-mobil){width:auto; margin-left:12px; margin-right:12px;}
}

/* ==================== 2026-10-10 görsel iyileştirmeler ==================== */

/* yazı tipi: tek aile (Poppins, index.php masaüstünde yükler) */
body, input, button, select, textarea{font-family:Poppins,"Segoe UI",Tahoma,Arial,sans-serif;}
#kanal_liste ul li a, .ai-liste, body .ya, body .ko, body .sy{font-family:inherit;}
#kanal_liste ul li a{font-size:12.5px;}

/* başlık altı çizgisi: yeşil (#350) yerine kırmızıdan şeffafa */
.ahr{height:2px; background:linear-gradient(90deg,#c8202a 0,rgba(200,32,42,.35) 45%,rgba(200,32,42,0) 100%); margin:6px 0 12px;}

/* üst bant: logo ile banner arası slogan (logoyla dikey ortalı) */
.header .ic{position:relative;}
.ust-bilgi{position:absolute; left:262px; top:30px; display:flex; flex-direction:column; gap:7px; align-items:flex-start;}
.ust-slogan{color:#f2f2f2; font-size:13px; font-weight:600; line-height:17px;}
.ust-slogan em{display:block; font-style:normal; font-weight:400; font-size:11.5px; color:#8f8f8f;}

/* menü: düz koyu zemin, aktif sekme düz kırmızı (alt şeritle birleşir) */
.nav{background:#0e0e0e; border-bottom:3px solid #b31c1a; box-shadow:0 2px 6px rgba(0,0,0,.35);}
.nav .button{width:auto; margin-right:2px;}
.nav .buton, .nav .buton:link, .nav .buton:visited, .nav .buton:active,
.nav .buton_a, .nav .buton_a:link, .nav .buton_a:visited, .nav .buton_a:active, .nav .buton_a:hover{
	height:44px; line-height:44px; padding:0 22px; font-size:13.5px; font-weight:500; border-radius:3px 3px 0 0; transition:background .15s, color .15s;}
.nav .buton, .nav .buton:link, .nav .buton:visited, .nav .buton:active{color:#bdbdbd; background:none;}
.nav .buton:hover{color:#fff; background:#1d1d1d;}
.nav .buton_a, .nav .buton_a:link, .nav .buton_a:visited, .nav .buton_a:active, .nav .buton_a:hover{color:#fff; background:#b31c1a;}
.arama-div{background:#b31c1a; margin-top:6px; padding:4px; border-radius:4px;}
.arama_text{height:28px; border-radius:2px 0 0 2px;}
.arama-button{border-radius:0 2px 2px 0;}

/* çerçeveler: ekran ve liste kutuları görsel yerine CSS (her genişlikte keskin) */
.div_ekran, .div_liste{background:linear-gradient(180deg,#272727,#141414); box-shadow:inset 0 0 0 1px #3a3a3a, 0 3px 10px rgba(0,0,0,.45); border-radius:4px;}
.ekran{background:#000; box-shadow:0 0 0 1px #000, 0 0 0 2px #2d2d2d;}
.div_liste::before{content:""; position:absolute; left:1px; right:1px; top:31px; height:3px; background:#b31c1a;}
.liste_dis #kanal_liste{background:#0c0c0c; box-shadow:0 0 0 1px #1c1c1c;}
.button_liste .tab, .button_liste .tab:link, .button_liste .tab:visited{background:linear-gradient(180deg,#2c2c2c,#1a1a1a); height:31px; line-height:31px; font-size:12.5px; color:#c4c4c4;}
.button_liste .tab:hover{background:linear-gradient(180deg,#3a1a1a,#251010); color:#fff;}
.button_liste .tab_a, .button_liste .tab_a:link, .button_liste .tab_a:visited, .button_liste .tab_a:hover{background:linear-gradient(180deg,#d22c27,#9a0f0f); height:31px; line-height:31px; font-size:12.5px; font-weight:500;}
.button_liste:first-child .tab, .button_liste:first-child .tab_a{border-top-left-radius:4px;}
.button_liste:nth-child(3) .tab, .button_liste:nth-child(3) .tab_a{border-top-right-radius:4px;}

/* kanal listesi: sıra numarası / gri metin kontrastı (#666 -> #8c8c8c) */
#kanal_liste, #kanal_liste td{color:#8c8c8c;}

/* bölümler: kart zemini + tek aralık ölçüsü (bölümler arası 24px, iç boşluk 16/18px) */
.div_ekran_alti, body .ai, .kanal-reytigleri{box-sizing:border-box; background:#0d0d0d; border:1px solid #1c1c1c; border-radius:6px; padding:16px 18px; margin:24px auto 0;}
.div_ekran_alti{overflow:visible; display:flow-root;}
.kanal-bilgi-sol, .kanal-bilgi-sag{width:571px; margin-top:0;}   /* 1200 - 2x18 iç boşluk - 2 kenar: 571+10 + 571+9 */
.sitene_ekle_input{width:564px;}
body .ai a.ai-tum{right:18px; top:20px;}
body .ai .ai-liste{padding-left:0;}
.kanal-reytigleri{overflow:visible; display:flow-root; position:relative;}
.kanal-reytigleri .tv-reyting-sutun{margin-left:0; margin-right:7px;}  /* 14 x (76+7) = 1162 */
.alt_menu{margin-top:32px; border:0; border-top:1px solid #1f1f1f; background:#101010;}

/* Aktif İzleyiciler: 3 sütun x 8 satır */
body .ai .ai-liste{grid-template-columns:repeat(3,minmax(0,1fr)); --satir:8 !important; gap:6px 12px;}

/* "Canlı Tv izle" metni: sola yaslı, rahat satır aralığı, devamını oku */
.metin-kutu{position:relative;}
.metin-ic{max-height:268px; overflow:hidden; position:relative; text-align:left; font-size:13.5px; line-height:1.65; color:#b4b4b4;}
.metin-ic p{margin:0 0 10px;}
.metin-ic::after{content:""; position:absolute; left:0; right:0; bottom:0; height:70px; background:linear-gradient(rgba(13,13,13,0),#0d0d0d); pointer-events:none;}
.metin-kutu.acik .metin-ic{max-height:none;}
.metin-kutu.acik .metin-ic::after, .metin-kutu.acik .metin-devam{display:none;}
.metin-devam{margin-top:6px; padding:6px 16px; border:1px solid #3a3a3a; border-radius:4px; background:#181818; color:#e6e6e6; font-size:12.5px; cursor:pointer;}
.metin-devam:hover{border-color:#c8202a; background:#2a1719; color:#fff;}

/* "Bu Akşam Ne Var?" (modul/modul-bu-aksam.php) — Aktif İzleyiciler kart diliyle */
.ba{min-height:300px;}
.ba-ust{display:flex; align-items:baseline; gap:10px; margin:2px 0 12px;}
.ba-ust strong{color:#fff; font-size:16px; font-weight:600;}
.ba-ust span{color:#8a8a8a; font-size:12px;}
.ba a.ba-tum{margin-left:auto; color:#cfcfcf; font-size:12px; text-decoration:none; white-space:nowrap;}
.ba a.ba-tum:hover{color:#fff; text-decoration:underline;}
.ba-liste{list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px;} /* minmax(0,..): uzun ad + "Yayında" kartı taşmasın */
.ba-k{min-width:0;}
.ba-k a{display:flex; align-items:center; gap:10px; height:58px; padding:0 10px 0 6px; box-sizing:border-box; text-decoration:none;
	background:linear-gradient(#1f1f1f,#151515); border:1px solid #2a2a2a; border-radius:5px; transition:border-color .15s, background .15s;}
.ba-k a:hover{border-color:#c8202a; background:linear-gradient(#2a1719,#180c0d);}
.ba-k img{flex:none; width:52px; height:39px; border-radius:3px; background:#fff; display:block;}
.ba-bilgi{display:flex; flex-direction:column; min-width:0; flex:1;}
.ba-bilgi b{color:#ececec; font-size:13px; font-weight:600; line-height:18px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.ba-k a:hover .ba-bilgi b{color:#fff;}
.ba-bilgi em{font-style:normal; color:#8f959f; font-size:11.5px; line-height:16px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.ba-canli{flex:none; font-style:normal; font-size:10.5px; font-weight:600; color:#fff; background:#c8202a; border-radius:3px; padding:0 6px; line-height:17px;}

/* Kanal Reytingleri: TV / Radyo sekmesi, ay seçici, ipucu */
.kr-arac{position:absolute; right:18px; top:14px; display:flex; align-items:center; gap:10px;}
.kr-sekme{display:flex; border:1px solid #2c2c2c; border-radius:4px; overflow:hidden; background:#161616;}
.kr-sekme button{border:0; background:none; color:#bdbdbd; font-size:12.5px; padding:5px 14px; cursor:pointer;}
.kr-sekme button:hover{color:#fff; background:#1f1f1f;}
.kr-sekme button.aktif{background:#b31c1a; color:#fff;}
.kr-donem{height:29px; padding:0 8px; border:1px solid #2c2c2c; border-radius:4px; background:#161616; color:#ddd; font-size:12.5px; cursor:pointer;}
#reyting-anasayfa{transition:opacity .2s;}
#reyting-anasayfa.kr-yukleniyor{opacity:.45;}
.kanal-reytigleri .tv-reyting-sutun{transition:border-color .15s;}
.kanal-reytigleri .tv-reyting-sutun:hover{border-color:#c8202a;}
.kanal-reytigleri .tv-reyting-sutun[data-ipucu]:hover::after{
	content:attr(data-ipucu); position:absolute; left:50%; bottom:100%; transform:translateX(-50%); margin-bottom:6px; z-index:5; pointer-events:none;
	white-space:nowrap; padding:5px 9px; border:1px solid #3a3a3a; border-radius:4px; background:#202020; color:#fff; font-size:12px; line-height:16px;
	box-shadow:0 4px 12px rgba(0,0,0,.5);}
.kanal-reytigleri .tv-reyting-sutun:nth-child(2):hover::after{left:0; transform:none;}

/* footer: 4 eşit sütun */
.footer{display:grid; grid-template-columns:repeat(4,1fr); padding-top:22px;}
.footer ul{float:none; width:auto; margin:0 0 14px; padding-left:22px;}
.footer .althr, .footer > span{grid-column:1 / -1;}

/* başlıklar: h1 / h2 bölüm başlıkları aynı boy ve ağırlıkta */
h1.ok_kirmizi, h2.ok_kirmizi{font-size:21px; font-weight:600; line-height:25px;}