/* =============================================================================
   Tedavül — ana sayfa düzeni
   -----------------------------------------------------------------------------
   Yalnızca ana sayfada yüklenir ve tamamı .s-ana altına kapatılmıştır; başka
   hiçbir sayfanın görünümünü etkilemez.

   Düzen referansı tek dosyalık bir arayüz prototipinden alındı: içerik
   blokları gri zemin üzerinde beyaz "yüzey" kartlarına oturur, üstte geniş
   bir vitrin + başlık listesi, sağda yapışkan yan sütun bulunur.
   Renk ve yazı tipi Tedavül'ın kendi tasarım tokenlarından gelir
   (tema.css :root) — ayrı bir palet yoktur.
   ============================================================================= */

.s-ana{
  /* Zemin rengi artık tema.css'teki --zemin-sayfa'dan geliyor (yüzen cam
     kabukla aynı sıcak kırık beyaz); burada yalnızca kart yarıçapı tanımlı. */
  --yuzey-radius:16px;
}

/* ---------------------------------------------------------------- YÜZEY KARTI */
.s-ana .yuzey{
  background:#fff;
  border:1px solid var(--cizgi);
  border-radius:var(--yuzey-radius);
  box-shadow:0 1px 2px rgba(11,18,32,.04),0 8px 24px rgba(11,18,32,.03);
}

/* Mevcut bölümler/kutular da kart görünümüne geçer (yalnızca ana sayfada) */
.s-ana .bolum{
  background:#fff;
  border:1px solid var(--cizgi);
  border-radius:var(--yuzey-radius);
  box-shadow:0 1px 2px rgba(11,18,32,.04),0 8px 24px rgba(11,18,32,.03);
  padding:20px 18px;
  margin:16px 0;
}
.s-ana .bolum.bant{background:#fff}
.s-ana .kutu{border-radius:var(--yuzey-radius);box-shadow:0 1px 2px rgba(11,18,32,.04),0 8px 24px rgba(11,18,32,.03)}
.s-ana .ana-duzen{gap:16px;padding-bottom:8px}
.s-ana .ana-yan{padding-top:16px}
@media (min-width:1100px){
  .s-ana .ana-duzen{grid-template-columns:minmax(0,1fr) 330px}
}

/* ---------------------------------------------------------------- SAYI KARTI */
/* Masaüstünde sayfanın tepesi: günün sayısının özeti (eski vitrinin yeri,
   aynı #vitrin kutusu). Telefonda kaydırmalı manşet şeridinin hemen altında
   (bkz. aşağıdaki TELEFON bloğu).
   Düzen referanstan (aposto.com ana sayfa sayı kartı): solda selamla başlayan
   büyük cümle, gri ikinci satır ve bölüm etiketli liste; sağda dar sütunda
   kapak ve "Sayının tamamını okuyun →". Referanstaki pembe köşe parlaması
   bilerek alınmadı; selam rengi sitenin vurgu rengi (turkuaz). */
@media (min-width:1100px){
  /* Kart iki sütunlu düzenin içinde: üst payı düzenin kendi boşluğundan
     gelir, yan sütunla aynı hizada başlar. */
  .s-ana .vitrin{display:block;padding:22px 24px 20px;margin:16px 0 0}
  .s-ana .ana-duzen > div > .vitrin:first-child{margin-top:0}
  .s-ana .ana-yan{padding-top:0}
  .s-ana .manset-izgara{display:none}
}
/* GÜN BAŞLIĞI: günün tarihi. Telefon ve masaüstünde birebir aynı;
   tek yerden çizilir (anasayfa.js). */
.gun-bas{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:12px 0 2px}
.gun-tarih{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--soluk)}
/* Kartın içindeyken kendi payı düzenden gelir; referanstaki gibi ayraçsız */
.s-ana .vitrin .gun-bas{padding:0;margin-bottom:12px}

.sk-izgara{display:grid;grid-template-columns:minmax(0,1fr) 160px;gap:28px;align-items:stretch}
.sk-manset{display:block;font-family:var(--f-baslik);font-weight:700;font-size:30px;line-height:1.2;
  letter-spacing:-.015em;color:var(--murekkep);text-wrap:pretty}
.sk-manset:hover{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:4px}
.sk-selam{color:var(--turkuaz)}
.sk-ikinci{margin:10px 0 14px;font-family:var(--f-baslik);font-size:16px;line-height:1.45;color:var(--ikincil)}

/* Bölüm etiketli liste: etiket sayfadaki sarı bölüm başlığının açık tonu */
.sk-liste{list-style:none;margin:0;padding:0}
.sk-liste li{border-top:1px solid var(--cizgi)}
.sk-liste a{display:flex;align-items:center;gap:12px;padding:9px 0;min-height:40px}
.sk-etiket{flex:0 0 auto;padding:4px 7px;border-radius:5px;background:#FFF3B8;color:#6B5200;
  font-size:9.5px;font-weight:700;letter-spacing:.07em;line-height:1.3;text-transform:uppercase;white-space:nowrap}
.sk-baslik{font-size:14px;line-height:1.4;color:var(--murekkep)}
.sk-liste a:hover .sk-baslik{text-decoration:underline;text-underline-offset:3px}

/* Sağ sütun: üstte kapak, altta "Sayının tamamını okuyun" listenin sonuyla hizalı */
.sk-yan{display:flex;flex-direction:column;justify-content:space-between;gap:16px}
.sk-kapak{display:block}
.sk-kapak .gorsel{aspect-ratio:5/4;border-radius:8px;margin-bottom:8px}
.sk-kapak b{display:block;font-size:12.5px;line-height:1.35;color:var(--murekkep)}
.sk-kapak span{display:block;font-size:11.5px;line-height:1.4;color:var(--soluk)}
.sk-kapak:hover b{text-decoration:underline;text-underline-offset:3px}
.sk-tamami{font-size:12.5px;font-weight:700;color:var(--murekkep);padding-bottom:10px}
.sk-tamami:hover{text-decoration:underline;text-underline-offset:3px}

/* Kartta görünen haberler "Öne çıkan yazılar" listesinde tekrar etmez
   (anasayfa.js → tekrarGizle). Kart artık her ekranda olduğu için gizleme de
   her ekranda geçerli. */
.s-ana #sonListe a.satir.sayi-kartinda{display:none}
/* "Öne çıkan yazılar" en fazla 8 yazı; fazlası gizli (anasayfa.js → tekrarGizle) */
.s-ana #sonListe a.satir.fazla{display:none}

/* ---------------------------------------------------------------- SAYI KARTI · TELEFON
   Aynı kart, dar ekrana göre yeniden dizilir. sk-metin ve sk-yan kutuları
   display:contents ile açılır, parçalar tek ızgarada yerleşir:
     [ selam + manşet cümlesi ][ kare kapak ]
     [ gri ikinci satır                     ]
     [ etiketli liste (en çok 5 madde)      ]
     [ Sayının tamamını okuyun →  (düğme)   ]
   Kartın kendi tarih satırı gizlenir: tarih sayfanın en üstünde zaten yazıyor. */
@media (max-width:1099px){
  .s-ana .vitrin{margin:14px 0 4px;padding:18px 16px 16px}
  .s-ana .vitrin .gun-bas{display:none}
  .sk-izgara{grid-template-columns:minmax(0,1fr) 88px;grid-template-areas:"manset kapak" "ikinci ikinci" "liste liste" "tamami tamami";
    column-gap:14px;row-gap:0}
  .sk-metin,.sk-yan{display:contents}
  .sk-manset{grid-area:manset;align-self:start;font-size:23px;line-height:1.22}
  .sk-kapak{grid-area:kapak;align-self:start}
  .sk-kapak .gorsel{aspect-ratio:1/1;margin:0;border-radius:10px}
  .sk-kapak b,.sk-kapak span{display:none}
  .sk-ikinci{grid-area:ikinci;margin:10px 0 12px;font-size:15.5px}
  .sk-liste{grid-area:liste}
  /* Etiket başlığın üstünde: uzun etiket ("FİNANS & EKONOMİ") başlığı
     daraltmasın, bütün başlıklar aynı hizadan başlasın */
  .sk-liste a{flex-direction:column;align-items:flex-start;gap:5px;padding:11px 0}
  .sk-baslik{font-size:15px;line-height:1.38}
  .sk-liste li:nth-child(n+6){display:none}
  .sk-tamami{grid-area:tamami;display:flex;align-items:center;justify-content:center;min-height:46px;
    margin-top:12px;padding:0 16px;border:1.5px solid var(--murekkep);border-radius:99px;font-size:14px}
}
@media (min-width:600px) and (max-width:1099px){
  /* Tablette yer var: kapak büyür, liste 6 maddeye çıkar */
  .sk-izgara{grid-template-columns:minmax(0,1fr) 132px;column-gap:20px}
  .sk-manset{font-size:27px}
  .sk-liste li:nth-child(6){display:block}
}


/* ---------------------------------------------------------------- BÜLTEN ŞERİDİ */
.bulten-serit{
  background:var(--murekkep);color:#fff;border-radius:var(--yuzey-radius);
  padding:26px 22px;margin:16px 0;
}
.bulten-serit .ustyazi{font-size:11px;letter-spacing:.12em;color:#8FA6D8;font-weight:700}
.bulten-serit h2{
  font-family:var(--f-baslik);font-weight:700;font-size:25px;line-height:1.2;
  margin:8px 0 6px;letter-spacing:-.01em;
}
.bulten-serit p{margin:0 0 16px;color:#AEB6C4;font-size:14px;max-width:44ch}
.bulten-form{display:flex;gap:8px;flex-wrap:wrap;max-width:480px}
.bulten-form input{
  flex:1 1 220px;min-height:46px;padding:0 14px;border-radius:99px;
  border:1.5px solid rgba(255,255,255,.22);background:rgba(255,255,255,.08);color:#fff;
}
.bulten-form input::placeholder{color:#8B94A5}
.bulten-form input:focus{outline:none;border-color:#fff;background:rgba(255,255,255,.14)}
.bulten-form button{
  min-height:46px;padding:0 22px;border-radius:99px;background:var(--kirmizi);color:#fff;
  font-weight:700;font-size:14.5px;white-space:nowrap;
}
.bulten-form button:hover{background:var(--kirmizi-koyu)}
.bulten-form button:disabled{opacity:.6;cursor:default}
.bulten-not{margin:10px 0 0;font-size:12.5px;min-height:18px;color:#AEB6C4}
.bulten-not.olur{color:#5FD6A0}
.bulten-not.hata{color:#FF8E84}
@media (min-width:768px){
  .bulten-serit{padding:32px 30px}
  .bulten-serit h2{font-size:29px}
}

/* ---------------------------------------------------------------- TELEFON */
@media (max-width:1099px){
  .s-ana .bolum{margin:12px 0;padding:18px 16px}
  /* Üst dolgu 12px'ti; son dakika şeridiyle manşet kartı arasındaki boşluğu
     büyütüyordu. Şerit zaten kendi kenar payını taşıyor. */
  .s-ana .manset-kaydir{margin:0 -16px;padding:6px 16px 4px}
}

/* Piyasa panosu tema.css'te (.pp-*): ana sayfa ve Piyasalar sayfası ortak.
   Ana sayfada kartlar GRAFİKSİZ (data-grafik="yok", piyasa.js çizmiyor):
   yer kaplamasın diye; grafikli ayrıntılı hâli Piyasalar sayfasında.
   Grafik kartın alt boşluğunu da taşıyordu, burada iç boşlukla verilir. */
.s-ana .pp-bolum .pp-durum{margin:-4px 0 10px}
.s-ana .pp-izgara[data-grafik="yok"] .pp-kart{padding-bottom:10px}
.s-ana .pp-izgara[data-grafik="yok"] .iskelet{min-height:58px}

/* Son dakika + en çok okunanlar: eski Analiz bölümünün yeri.
   Masaüstünde yan yana, telefonda alt alta. */
.s-ana .ana-ikili{display:grid;gap:16px;margin:16px 0}
@media (min-width:1100px){ .s-ana .ana-ikili{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start} }

/* Son dakika kutusu: saat + başlık. Üstteki şeritle aynı akış. */
.sd-kutu ol{list-style:none;margin:0;padding:0}
.sd-kutu li{border-bottom:1px solid var(--cizgi)}
.sd-kutu li:last-child{border-bottom:0}
.sd-kutu li a{display:flex;gap:12px;align-items:baseline;padding:12px 16px}
.sd-kutu time{flex:0 0 auto;font-size:13px;font-weight:700;color:var(--kirmizi);font-variant-numeric:tabular-nums}
.sd-kutu span{font-family:var(--f-baslik);font-weight:700;font-size:16.5px;line-height:1.2;color:var(--murekkep)}
.sd-kutu li a:hover span{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px}