/* Valentra - vergi haberleri portali */

:root {
    --lacivert:      #17304f;
    --lacivert-acik: #2b4a73;
    --altin:         #c9a86a;
    --altin-koyu:    #a8854a;
    --zemin:         #f6f7f9;
    --kart:          #ffffff;
    --metin:         #14213a;
    --metin-soluk:   #5d6a80;
    --cizgi:         #e2e6ec;
    --vurgu:         #1b4f8f;
    --golge:         0 1px 2px rgba(20, 33, 58, .05), 0 4px 16px rgba(20, 33, 58, .06);
    --yuvarlak:      10px;
    /* Genislik ucuncu kez artti (1180 -> 1460 -> 1680 -> 1880).
       Olculen sebep: 1680'lik kapak 1920px'lik ekranda iki yana
       120'ser piksel bos birakiyordu. 1880'de bu 20'ye iniyor ve
       ana kolon 1230'dan ~1420'ye cikiyor; dort kartin her biri
       261 yerine ~310 piksel oluyor. Yazinin kucuk GORUNMESININ
       ikinci sebebi buydu; puntonun kendisi asagida ayrica
       buyutuldu.

       Metin sayfalari bu genisligi KULLANMAZ: 1880'lik bir kapta
       duz paragraf satiri 190 karaktere ciktigi icin okunmuyordu.
       Onlar body.okuma ile daraliyor (asagida). */
    --genislik:      1880px;
}

@media (prefers-color-scheme: dark) {
    :root:where(:not([data-tema="acik"])) {
        --zemin:       #0d1522;
        --kart:        #151f30;
        --metin:       #eef2f8;
        --metin-soluk: #97a3b8;
        --cizgi:       #24314a;
        --vurgu:       #7aa9e8;
        --golge:       0 1px 2px rgba(0, 0, 0, .4);
    }
}

:root:where([data-tema="koyu"]) {
    --zemin:       #0d1522;
    --kart:        #151f30;
    --metin:       #eef2f8;
    --metin-soluk: #97a3b8;
    --cizgi:       #24314a;
    --vurgu:       #7aa9e8;
    --golge:       0 1px 2px rgba(0, 0, 0, .4);
}

* { box-sizing: border-box; }

/*
 * Punto olcegi.
 *
 * Sayfadaki kucuk yazilar okunmuyordu. Cozum her seyi ayni oranda
 * buyutmek degildi: sorun genelde kucukluk degil, olcegin ALT ucuydu —
 * rozetler, kunye satirlari ve ipuclari 11-12 piksele iniyordu. Bu
 * yuzden olcek sikistirildi: en kucuk puntolar en cok buyudu, buyuk
 * basliklar neredeyse sabit kaldi. Boylece okunabilirlik artarken
 * baslik/metin hiyerarsisi korunuyor.
 *
 * Taban punto acikca yaziliyor (1rem = tarayicinin varsayilani,
 * genelde 16px). Sabit bir px degeri VERILMEDI ve verilmemeli:
 * ziyaretci tarayici ayarindan puntoyu buyutmusse — ki bu kitlede
 * sik — o tercih gecerli kalmali. (Bu dalda bir ara html'e 17px
 * yazilmisti; ayni sorunu cozuyordu ama ziyaretcinin ayarini
 * eziyordu, o yuzden geri alindi.)
 */
body {
    margin: 0;
    background: var(--zemin);
    color: var(--metin);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
                 "Helvetica Neue", Arial, sans-serif;
    font-size: 1rem;
    /* Satir araligi da acildi: uzun mevzuat metinlerinde satir takibi
       kolaylasiyor. */
    line-height: 1.62;
    -webkit-font-smoothing: antialiased;
}

a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }

.sinirli {
    width: 100%;
    max-width: var(--genislik);
    margin: 0 auto;
    padding: 0 24px;
}

/*
 * Okuma sayfalari (haber detayi gibi duz metin agirlikli olanlar)
 * kapin tamamini kullanmaz. Tipografi olcusu bellidir: bir satir
 * 80 karakteri gecince goz satir basini kaybeder. 1320'lik kapta
 * yan pencere ve ic bosluklar dustukten sonra metin ~775 piksel,
 * yani ~80 karakter kaliyor.
 */
body.okuma .sinirli { max-width: 1320px; }

/* --- Ust bant ------------------------------------------------------------ */

.ust-bant {
    background: var(--kart);
    border-bottom: 1px solid var(--cizgi);

    /*
     * YAPISKAN DEGIL.
     *
     * Once hem bu bant hem menu bandi "sticky; top: 0" idi. Iki yapiskan
     * seride ayni yere capalanamaz: sayfa kaydirilinca ikisi ust uste
     * biniyor ve z-index'i yuksek olan menu, logo bandini ortuyordu.
     * Ekranda yarim kesilmis bir ust bolum goruntusu bundan cikiyordu.
     *
     * Cozum yalnizca MENUYU yapiskan birakmak. Gezinme zaten menude;
     * logo serisinin ekranda kalmasi gerekmiyor ve boylece her ekranda
     * 64 piksel dusey alan haberlere kaliyor.
     */
    position: relative;
    z-index: 20;
}

.ust-bant .sinirli {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-height: 64px;
    flex-wrap: wrap;
}

.logo {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 0;
}

.logo .marka {
    width: 54px;
    height: 47px;
    flex: none;
}

.logo .yazi {
    display: flex;
    flex-direction: column;
    line-height: 1;
}

/*
 * Marka adi kucuk kaliyordu.
 *
 * 1.32rem ve 400 agirlik, genis harf araligiyla birlikte adi
 * silikleştiriyordu: sayfanin en ust satirindaki en onemli kelime,
 * yanindaki tarih yazisindan yalnizca biraz buyuktu. Punto ve agirlik
 * artti, harf araligi bir tik kisaldi — cok genis aralik buyuk
 * puntoda adi dagitiyor.
 */
.logo .ad {
    font-size: 2rem;
    font-weight: 600;
    letter-spacing: .16em;
    text-indent: .16em;
    color: var(--lacivert);
    line-height: 1.05;
}

.logo .alt {
    margin-top: 6px;
    font-size: .80rem;
    font-weight: 500;
    letter-spacing: .19em;
    text-indent: .19em;
    color: var(--metin-soluk);
    white-space: nowrap;
}

@media (prefers-color-scheme: dark) {
    :where(:root:not([data-tema="acik"])) .logo .ad { color: #e8edf5; }
}

:where(:root[data-tema="koyu"]) .logo .ad { color: #e8edf5; }

@media (max-width: 480px) {
    .logo .alt { display: none; }
}

.ust-bilgi {
    font-size: .90rem;
    color: var(--metin-soluk);
}

/* --- Bolum basligi ------------------------------------------------------- */

.bolum-basligi {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 32px 0 16px;
}

.bolum-basligi h2 {
    margin: 0;
    font-size: .94rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    background: var(--lacivert);
    color: #fff;
    padding: 6px 14px;
    border-radius: 4px;
}

.bolum-basligi .cizgi {
    flex: 1;
    height: 2px;
    background: linear-gradient(90deg, var(--altin), transparent);
}

/* --- Manset -------------------------------------------------------------- */

.manset {
    display: grid;
    grid-template-columns: 1.6fr 1fr;
    gap: 20px;
    margin-bottom: 28px;
}

.manset-ana {
    position: relative;
    background: var(--kart);
    border-radius: var(--yuvarlak);
    box-shadow: var(--golge);
    overflow: hidden;
    min-height: 340px;
    display: flex;
    flex-direction: column;
}

.manset-ana > a {
    display: flex;
    flex-direction: column;
    flex: 1;
}

.manset-ana .gorsel {
    aspect-ratio: 16 / 9;
    background: linear-gradient(135deg, #17304f, #2b4a73);
    object-fit: cover;
    width: 100%;
}

.manset-ana .govde {
    padding: 22px 24px 26px;
    display: flex;
    flex-direction: column;
    flex: 1;
}

/* Gorseli olmayan manset: bos blok yerine lacivert tipografik panel */
.manset-ana.yazili {
    background: linear-gradient(150deg, #17304f 0%, #23405f 55%, #2b4a73 100%);
    color: #fff;
}

.manset-ana.yazili .govde { justify-content: center; padding: 40px 36px 44px; }
.manset-ana.yazili h1 { color: #fff; }
.manset-ana.yazili .ozet { color: #c3d0e2; }
.manset-ana.yazili .kart-alt { color: #9db0c9; }
.manset-ana.yazili .etiket { color: var(--altin); }

.manset-ana.yazili::before {
    content: "";
    display: block;
    height: 3px;
    background: linear-gradient(90deg, var(--altin), transparent 70%);
}

.manset-ana h1 {
    margin: 0 0 10px;
    font-size: clamp(1.5rem, 3.2vw, 2.15rem);
    font-weight: 800;
    line-height: 1.18;
    letter-spacing: -.01em;
}

.manset-yan {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.manset-yan .kart { flex: 1; }

.manset-yan .kart > a {
    display: flex;
    flex-direction: column;
    flex: 1;
}

/* --- Kartlar ------------------------------------------------------------- */

/*
 * Sutun sayisi artik acik yaziliyor, auto-fill degil.
 *
 * auto-fill kart genisligine gore sutun sayisini kendi seciyordu ve
 * genis ekranda uce dusuyordu; 10 haberde son satirda tek kart
 * kaliyordu. Acik sutun sayisi hem dorde cikariyor hem de kac haber
 * basilacagini onceden bilinir kiliyor (index.php 12 basiyor: 4, 3 ve
 * 2 sutunun hepsinde satirlar tam doluyor).
 *
 * Esikler kenar cubugu hesaba katilarak secildi: 1500px'lik ekranda
 * ana kolon ~1050px kaliyor ve dort kart 248'er piksel oluyor.
 */
.kart-izgara {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 20px;
}

@media (max-width: 1500px) {
    .kart-izgara { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 1100px) {
    .kart-izgara { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 620px) {
    .kart-izgara { grid-template-columns: 1fr; }
}

.kart {
    background: var(--kart);
    border-radius: var(--yuvarlak);
    box-shadow: var(--golge);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: transform .15s ease, box-shadow .15s ease;
}

.kart:hover {
    transform: translateY(-2px);
    box-shadow: 0 2px 4px rgba(16, 20, 28, .08), 0 10px 24px rgba(16, 20, 28, .1);
}

.kart .gorsel {
    aspect-ratio: 16 / 9;
    background: linear-gradient(135deg, #17304f, #2b4a73);
    object-fit: cover;
    width: 100%;
}

/* Gorseli olmayan kart: ustte ince altin cizgi */
.kart.yazili::before {
    content: "";
    display: block;
    height: 3px;
    background: linear-gradient(90deg, var(--altin), transparent 75%);
}

.kart .govde {
    padding: 14px 16px 18px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    flex: 1;
}

.kart h3 {
    margin: 0;
    font-size: 1.08rem;
    font-weight: 700;
    line-height: 1.32;
}

.ozet {
    margin: 0;
    font-size: .96rem;
    color: var(--metin-soluk);
}

.kart-alt {
    margin-top: auto;
    padding-top: 6px;
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    font-size: .86rem;
    color: var(--metin-soluk);
}

.etiket {
    display: inline-block;
    font-size: .82rem;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--altin-koyu);
}

/* --- Haber detay --------------------------------------------------------- */

.detay {
    background: var(--kart);
    border-radius: var(--yuvarlak);
    box-shadow: var(--golge);
    padding: clamp(22px, 4vw, 44px);
    margin: 28px 0;
}

.detay h1 {
    margin: 0 0 14px;
    font-size: clamp(1.6rem, 4vw, 2.5rem);
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -.015em;
}

.detay .kunye {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    align-items: center;
    padding-bottom: 18px;
    margin-bottom: 22px;
    border-bottom: 1px solid var(--cizgi);
    font-size: .94rem;
    color: var(--metin-soluk);
}

.detay .spot {
    font-size: 1.12rem;
    color: var(--metin-soluk);
    margin: 0 0 22px;
}

/*
 * Haber govdesi.
 *
 * Punto olcekten geliyor (govde 1rem); burada yalnizca satir araligi
 * aciliyor. Govde varsayilani 1.62, uzun duz metin icin 1.75: haber
 * sayfasi sitedeki en uzun kesintisiz metin ve satir takibi orada
 * en cok zorlaniyor.
 */
.detay .icerik {
    line-height: 1.75;
}

.detay .icerik p { margin: 0 0 1.05em; }

.gomulu-icerik {
    width: 100%;
    min-height: 520px;
    margin: 28px 0;
    overflow: hidden;
    border: 1px solid var(--cizgi);
    border-radius: 8px;
}

.gomulu-icerik iframe {
    display: block;
    width: 100%;
    height: 70vh;
    min-height: 520px;
    border: 0;
    background: #fff;
}

@media (max-width: 700px) {
    .gomulu-icerik,
    .gomulu-icerik iframe {
        min-height: 420px;
    }

    .gomulu-icerik iframe {
        height: 65vh;
    }
}

.kaynak-kutusu {
    margin-top: 28px;
    padding: 14px 16px;
    border: 1px solid var(--cizgi);
    border-radius: 8px;
    font-size: .94rem;
    color: var(--metin-soluk);
}

.kaynak-kutusu a { color: var(--vurgu); text-decoration: underline; }

/* --- Bos durum ----------------------------------------------------------- */

.bos-durum {
    background: var(--kart);
    border: 1px dashed var(--cizgi);
    border-radius: var(--yuvarlak);
    padding: 56px 24px;
    text-align: center;
    color: var(--metin-soluk);
    margin: 28px 0;
}

.bos-durum strong {
    display: block;
    color: var(--metin);
    font-size: 1.15rem;
    margin-bottom: 6px;
}

/* --- Alt bant ------------------------------------------------------------ */

.alt-bant {
    margin-top: 48px;
    padding: 28px 0;
    border-top: 1px solid var(--cizgi);
    background: var(--kart);
    font-size: .94rem;
    color: var(--metin-soluk);
}

.alt-bant .sinirli {
    display: flex;
    justify-content: space-between;
    gap: 14px;
    flex-wrap: wrap;
}

/* --- Duyarli ------------------------------------------------------------- */

@media (max-width: 860px) {
    .manset { grid-template-columns: 1fr; }
}

/* --- Konu menusu --------------------------------------------------------- */

.ust-satir {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-height: 64px;
    flex-wrap: wrap;
}

.menu-bant {
    background: var(--lacivert);

    /* Sayfadaki TEK yapiskan serit; bkz. .ust-bant aciklamasi. */
    position: sticky;
    top: 0;
    z-index: 30;
    box-shadow: 0 1px 0 rgba(255, 255, 255, .06) inset;
}

.menu-satir {
    display: flex;
    align-items: stretch;
    gap: 0;
    flex-wrap: wrap;

    /* Acilir liste bandin disina tasabilmeli. overflow-x: auto verilirse
       CSS overflow-y'yi de kirpar ve liste gorunmez olur; bu yuzden genis
       ekranda kaydirma yok, ogeler gerekirse alt satira gecer. */
    overflow: visible;
}

.menu-satir::-webkit-scrollbar { display: none; }

.menu-oge {
    flex: none;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 0 18px;
    min-height: 48px;
    border: none;
    background: none;
    color: #c8d5e6;
    font-family: inherit;
    font-size: .96rem;
    font-weight: 600;
    letter-spacing: .01em;
    white-space: nowrap;
    cursor: pointer;
    position: relative;
    transition: color .14s ease, background .14s ease;
}

.menu-oge::after {
    content: "";
    position: absolute;
    left: 14px;
    right: 14px;
    bottom: 0;
    height: 2px;
    background: var(--altin);
    transform: scaleX(0);
    transition: transform .16s ease;
}

.menu-oge:hover { color: #fff; background: rgba(255, 255, 255, .06); }

a.menu-oge.aktif,
.menu-grup.aktif > .menu-oge { color: #fff; }

a.menu-oge.aktif::after,
.menu-grup.aktif > .menu-oge::after { transform: scaleX(1); }

.menu-oge .ok { transition: transform .16s ease; opacity: .7; }
.menu-grup.acik .menu-oge .ok { transform: rotate(180deg); }
.menu-grup.acik > .menu-oge { color: #fff; background: rgba(255, 255, 255, .09); }

/* --- Acilir liste -------------------------------------------------------- */

.menu-grup { position: relative; flex: none; }

.menu-acilir {
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 240px;
    background: var(--kart);
    border: 1px solid var(--cizgi);
    border-top: 2px solid var(--altin);
    border-radius: 0 0 9px 9px;
    box-shadow: 0 12px 32px rgba(16, 26, 44, .18);
    padding: 6px;
    z-index: 40;

    opacity: 0;
    visibility: hidden;
    transform: translateY(-6px);
    transition: opacity .14s ease, transform .14s ease, visibility .14s;
}

.menu-grup.acik .menu-acilir,
.menu-grup:hover .menu-acilir {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.menu-acilir a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 9px 13px;
    border-radius: 6px;
    color: var(--metin);
    font-size: .96rem;
    font-weight: 500;
    transition: background .12s ease, color .12s ease;
}

.menu-acilir a:hover { background: rgba(23, 48, 79, .07); color: var(--lacivert); }

.menu-acilir a.aktif {
    background: rgba(201, 168, 106, .16);
    color: var(--lacivert);
    font-weight: 700;
}

.menu-acilir .adet {
    font-size: .82rem;
    font-weight: 600;
    color: var(--metin-soluk);
    background: var(--zemin);
    border-radius: 999px;
    padding: 1px 8px;
}

.menu-acilir a.aktif .adet { background: var(--altin); color: #14213a; }

@media (prefers-color-scheme: dark) {
    :where(:root:not([data-tema="acik"])) .menu-acilir a:hover { background: rgba(255, 255, 255, .07); color: #fff; }
    :where(:root:not([data-tema="acik"])) .menu-acilir a.aktif { color: #fff; }
}

:where(:root[data-tema="koyu"]) .menu-acilir a:hover { background: rgba(255, 255, 255, .07); color: #fff; }
:where(:root[data-tema="koyu"]) .menu-acilir a.aktif { color: #fff; }

/* Dar ekranda acilir liste yatay kaydirmayi bozmasin: akisa gecer. */
@media (max-width: 720px) {
    /* Dar ekranda menu yatay kayiyor. */
    .menu-satir {
        flex-wrap: nowrap;
        overflow-x: auto;
        scrollbar-width: none;
    }

    .menu-satir::-webkit-scrollbar { display: none; }
    .menu-oge { padding: 0 14px; min-height: 44px; font-size: .94rem; }

    /*
     * Acilir liste MENU BANDINA gore konumlaniyor, kayan seride gore
     * degil: .menu-grup ve .menu-satir konumsuz (static), en yakin
     * konumlu ata yapiskan .menu-bant. Kapsayici blogu kayan seridin
     * DISINDA kalan oge o seridin overflow'u ile kirpilmaz; liste bandin
     * hemen altinda, tam genislikte acilir ve serit kaysa da yerinde
     * durur.
     *
     * Onceden position:fixed + betikle hesaplanan top vardi (#62).
     * Chromium'da calisiyordu ama telefonda (iPhone/Safari) liste yine
     * gorunmuyordu: WebKit kayan seridin icindeki sabit konumlu ogeyi
     * kirpabiliyor (ozellikle -webkit-overflow-scrolling ile). Bu
     * yontem hesap da betik de gerektirmiyor.
     */
    .menu-grup { position: static; }

    .menu-acilir {
        top: 100%;
        left: 8px;
        right: 8px;
        min-width: 0;
        max-height: 70vh;
        overflow-y: auto;
    }

    .menu-grup:hover .menu-acilir { opacity: 0; visibility: hidden; }
    .menu-grup.acik .menu-acilir { opacity: 1; visibility: visible; }
}

/* --- Kayan manset -------------------------------------------------------- */

.kaydirak {
    position: relative;
    background: var(--kart);
    border-radius: var(--yuvarlak);
    box-shadow: var(--golge);
    overflow: hidden;
    margin-bottom: 10px;
}

.kaydirak-pencere {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    scrollbar-width: none;
}

.kaydirak-pencere::-webkit-scrollbar { display: none; }

.kaydirak-slayt {
    flex: 0 0 100%;
    scroll-snap-align: start;
    min-width: 0;
}

.kaydirak-slayt > a {
    display: flex;
    flex-direction: column;

    /*
     * Yukseklik EKRANA gore.
     *
     * Sabit 330px yuksekligin uzerine gorselli slaytta 110px ust dolgu
     * ve baslik gelince kutu 450 pikseli asiyordu; menu ve sayfa
     * numaralariyla birlikte kaydirak bir ekrana sigmiyor, ziyaretci
     * ilk haberi gormek icin kaydirmak zorunda kaliyordu.
     *
     * OLCULDU: 58vh, 1718x900 ekranda mansetı 522 piksel yapiyordu ve
     * kart izgarasinin ust kenari 651 pikselde kaliyordu — yani
     * ziyaretci ilk ekranda tek bir haber kartı bile goremiyordu.
     * Manset sayfanin yuzu, tamami degil.
     *
     * 42vh / en fazla 400px: ayni ekranda manset 378 piksele, ilk
     * kart 507 pikseline iniyor; izgaranin ust siri katlanin ustunde
     * basliyor.
     *
     * 22.10.2026: site sahibi ana haber alaninin buyumesini istedi.
     * Manset artik ana kolonun tam genisliginde (kose yazilari kutusu
     * yan pencereye gecti); yukseklik de 48vh / en fazla 460px. Ilk
     * kart sirasinin ust kenari 900 piksellik ekranda hala katlanin
     * ustunde kaliyor.
     */
    height: clamp(320px, 48vh, 460px);
    background: linear-gradient(150deg, #17304f 0%, #23405f 55%, #2b4a73 100%);
    color: #fff;
}

.kaydirak-slayt.gorselli > a {
    position: relative;
    justify-content: flex-end;
    background: #17304f;
    /* Bulanik arka gorsel kutudan tasmasin. */
    overflow: hidden;
}

/*
 * Arka plan: ayni gorselin bulanik, koyulastirilmis kopyasi. Ondeki
 * gorsel artik KIRPILMIYOR (asagida, contain); kutunun gorselden genis
 * kalan yanlari bununla doluyor, bos serit gorunmuyor.
 */
.kaydirak-slayt .arka-gorsel {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: blur(22px) brightness(.55) saturate(1.1);
    transform: scale(1.12);
}

.kaydirak-slayt .ust-gorsel {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    /*
     * KIRPMA YOK (site sahibinin istegi, 23.10.2026: "haberlerde
     * Putin'in basi yarim gorunuyor; arka planda tam gorunecek sekilde
     * ayarla"). Kutu ~2,6:1, haber gorselleri cogunlukla 16:9; cover ile
     * gorselin ustu ve alti ucte bir kesiliyordu. Gorsel artik tamami
     * gorunecek sekilde (contain) ortada, yanlari .arka-gorsel dolduruyor.
     */
    object-fit: contain;

    /*
     * (Eski not, cover icin.) Kirpma ortadan degil USTTEN.
     *
     * Kutu, haber gorsellerinin cogundan daha genis bir orana sahip
     * (yaklasik 2:1'e karsi 16:9). object-fit: cover genisligi
     * doldurup artan yuksekligi ustten ve alttan ESIT kirpiyor;
     * binanin ya da kisinin ustu kesiliyordu.
     *
     * %35 ile kirpma agirligi ust yariya kayiyor: haber
     * fotograflarinda konu neredeyse her zaman ust-orta bolgede,
     * alt bolge ise zaten koyu gecisin altinda kaliyor.
     *
     * Ayni ayar kart ve manset gorsellerine UYGULANMADI: onlarin kutu
     * oranlari farkli ve sikayet yalnizca kaydiraktaydi.
     */
    object-position: center;
    /*
     * Eskiden .5 idi. Kaynak sitelerin paylasim gorsellerinde baslik
     * cogu zaman resmin icine gomulu oluyor; yariya indirilmis resim
     * bizim baslgimizin arkasinda hayalet bir yazi gibi duruyordu.
     * Resim netlesince fotograf gibi okunuyor, metnin okunurlugunu ise
     * asagidaki koyu gecis sagliyor.
     */
    opacity: 1;
}

.kaydirak-govde {
    position: relative;
    /* Yatay bosluk oklardan genis: 14px kenar + 42px ok + nefes payi.
       Daha az verilince baslik okun altina giriyor. */
    padding: 34px 70px 38px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    flex: 1;
    gap: 10px;
}

.kaydirak-slayt.gorselli .kaydirak-govde {
    flex: none;

    /*
     * Gecis DAHA DAR ve DAHA DIK.
     *
     * Kirpma olculdu ve sorun orada degildi: gorselin yalnizca %3'u
     * kirpiliyor. "Resim yarim gorunuyor" sikayetinin sebebi koyu
     * gecisti — eski degerlerle karartma gorselin yarisindan
     * fazlasini kapliyordu (bantli test gorselinde %50 bandindan
     * asagisi tamamen koyuydu).
     *
     * Metnin arkasi koyu KALIYOR; okunurluk pazarlik konusu degil,
     * beyaz yazi fotograf uzerinde okunmali. Degisen yalnizca ust
     * kisim: karartma %55'ten sonra hizla siliniyor, boylece
     * fotografin ust yarisi net duruyor.
     */
    background: linear-gradient(to top,
        rgba(8, 16, 30, .97) 0%,
        rgba(8, 16, 30, .93) 38%,
        rgba(8, 16, 30, .55) 68%,
        rgba(8, 16, 30, .12) 88%,
        transparent 100%);

    /*
     * Ust dolgu kucultuldu: 110px'lik dolgu kutuyu bosu bosuna
     * buyutuyor ve buyuyen kutu daha fazla gorseli karartma altinda
     * birakiyordu.
     */
    padding-top: clamp(26px, 7vh, 64px);
}

.kaydirak-govde .grup {
    align-self: flex-start;
    background: var(--altin);
    color: #14213a;
    font-size: .82rem;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    padding: 4px 11px;
    border-radius: 3px;
}

.kaydirak-govde h2 {
    margin: 0;
    font-size: clamp(1.45rem, 3.3vw, 2.3rem);
    font-weight: 800;
    line-height: 1.16;
    letter-spacing: -.012em;
    color: #fff;

    /*
     * En fazla iki satir.
     *
     * Metin kutusunun yuksekligi dogrudan gorselin ne kadarinin
     * karartma altinda kaldigini belirliyor. Uc satirlik bir baslik
     * kutuyu buyutup fotografi yutuyordu. Kesilen baslik zaten
     * habere tiklandiginda tam gorunuyor.
     */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.kaydirak-govde .ozet {
    margin: 0;
    color: #c8d5e6;
    font-size: 1rem;
    max-width: 62ch;

    /* Ayni gerekce: uc satirlik spot kutuyu buyutup gorseli
       karartma altinda birakiyordu. Iki satir ozeti veriyor. */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.kaydirak-govde .kunye {
    font-size: .90rem;
    color: #9db0c9;
}

.kaydirak-ok {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 42px;
    height: 42px;
    border: none;
    border-radius: 50%;
    background: rgba(255, 255, 255, .16);
    color: #fff;
    font-size: 1.26rem;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    backdrop-filter: blur(4px);
    z-index: 2;
}

.kaydirak-ok:hover { background: rgba(255, 255, 255, .3); }
.kaydirak-ok.sol  { left: 14px; }
.kaydirak-ok.sag  { right: 14px; }

/*
 * Manset 20 haber, dugmeler TEK SATIR (site sahibinin istegi,
 * 22.10.2026: "iki sira olmasin"). Sutun sayisi slayt sayisindan
 * (kaydirak.php --adet); sutunlar daralabiliyor (minmax 0), satir hic
 * kirilmiyor.
 */
.kaydirak-sayfalar {
    display: grid;
    grid-template-columns: repeat(var(--adet, 10), minmax(0, 30px));
    justify-content: center;
    gap: 6px;
    padding: 0 0 26px;
}

.kaydirak-sayfalar button {
    width: 100%;
    aspect-ratio: 1;
    padding: 0;
    border: 1px solid var(--cizgi);
    border-radius: 50%;
    background: var(--kart);
    color: var(--metin-soluk);
    font-size: .90rem;
    font-weight: 600;
    font-family: inherit;
    cursor: pointer;
    transition: all .12s ease;
}

.kaydirak-sayfalar button:hover { border-color: var(--altin); color: var(--metin); }

.kaydirak-sayfalar button[aria-current="true"] {
    background: var(--lacivert);
    border-color: var(--lacivert);
    color: #fff;
}

/*
 * Dar ekranda yirmi numarali dugme tek satira okunur sigmiyor (360'lik
 * ekranda dugme basina 13 piksel kalir). Telefonda numaralar gizlenip
 * dugmeler kucuk noktalara donuyor: 20 x 10px + 19 x 5px = 295 piksel,
 * 360'lik ekrana (312 piksel yer) sigiyor; daha dar ekranda sutunlar
 * daraliyor. Ekran okuyucu icin aria-label duruyor; gezinme icin iki
 * yandaki oklar da var.
 */
@media (max-width: 480px) {
    .kaydirak-sayfalar {
        grid-template-columns: repeat(var(--adet, 10), minmax(0, 10px));
        gap: 5px;
        align-items: center;
    }

    .kaydirak-sayfalar button {
        font-size: 0;
        border-width: 1px;
        background: var(--cizgi);
    }
}

/* --- Kategori basligi ---------------------------------------------------- */

.kategori-basligi {
    margin: 30px 0 4px;
}

.kategori-basligi h1 {
    margin: 0;
    font-size: clamp(1.5rem, 3.4vw, 2.1rem);
    font-weight: 800;
    letter-spacing: -.012em;
}

.kategori-basligi p {
    margin: 6px 0 0;
    color: var(--metin-soluk);
}

@media (max-width: 640px) {
    .kaydirak-govde { padding: 26px 22px 28px; }

    /* Telefonda ekranin yarisindan fazlasini tek habere vermek,
       altindaki listeyi tamamen gorunmez yapiyor. */
    .kaydirak-slayt > a { height: clamp(280px, 46vh, 380px); }

    /*
     * Telefonda spot gizleniyor.
     *
     * Olcum: dar ekranda metin kutusu 380 pikselik slaytin 366'sini
     * kapliyordu, yani fotograf pratikte hic gorunmuyordu. Baslik ve
     * kunye kaliyor; spot zaten haberin ilk cumlesi ve bir dokunus
     * otede.
     */
    .kaydirak-govde .ozet { display: none; }
    .kaydirak-ok { display: none; }
}

/* --- Ana duzen: icerik + yan pencere ------------------------------------- */

/*
 * Ana kolon minmax(0, 1fr) ile tanimli; aksi halde icindeki kaydirak ve
 * izgara kolonu tasirip yan pencereyi ekrandan atiyor.
 */
.ana-duzen {
    display: grid;
    /* Yan pencere 340 piksel (22.10.2026'ya kadar 380): site sahibi ana
       haber alaninin buyumesini istedi. Yan penceredeki en genis kutu
       "Valentra Diyor ki…" da onceden 340 pikseldi. */
    grid-template-columns: minmax(0, 1fr) 340px;
    gap: 30px;
    align-items: start;
}

.ana-kolon { min-width: 0; }

/* Piyasa ve sirket sayfalari: yan pencere yok, grafikler tam genislikte
   (site sahibinin istegi, 23.10.2026: "grafikler sayfaya yerlessin,
   yanlarda bosluklari azaltalim"). */
.ana-duzen.tam { grid-template-columns: minmax(0, 1fr); }

/* --- Pencereler ---------------------------------------------------------- */

.yan-pencere {
    display: flex;
    flex-direction: column;
    gap: 18px;
    position: sticky;
    top: 16px;
}

.pencere {
    background: var(--kart);
    border-radius: var(--yuvarlak);
    box-shadow: var(--golge);
    padding: 16px 18px;
}

.pencere-baslik {
    margin: 0 0 12px;
    font-size: .90rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--lacivert);
    padding-bottom: 10px;
    border-bottom: 2px solid var(--altin);
}

@media (prefers-color-scheme: dark) {
    :where(:root:not([data-tema="acik"])) .pencere-baslik { color: var(--altin); }
}

:where(:root[data-tema="koyu"]) .pencere-baslik { color: var(--altin); }

.pencere-metin {
    margin: 0;
    font-size: .96rem;
    color: var(--metin-soluk);
}

.pencere-vurgu {
    background: var(--lacivert);
}

.pencere-vurgu .pencere-baslik {
    color: #fff;
    border-bottom-color: var(--altin);
}

.pencere-vurgu .pencere-metin { color: rgba(255, 255, 255, .82); }

/* Son eklenenler */

.sirali-liste {
    list-style: none;
    margin: 0;
    padding: 0;
}

.sirali-liste li {
    display: flex;
    gap: 12px;
    padding: 11px 0;
    border-top: 1px solid var(--cizgi);
}

.sirali-liste li:first-child { border-top: 0; padding-top: 0; }

.sirali-liste .sira {
    flex: 0 0 22px;
    font-size: 1.10rem;
    font-weight: 700;
    color: var(--altin-koyu);
    line-height: 1.3;
}

.sirali-liste .ad {
    display: block;
    font-size: .98rem;
    font-weight: 600;
    line-height: 1.35;
}

.sirali-liste a:hover .ad { color: var(--vurgu); }

.ust-bilgi {
    display: block;
    margin-top: 3px;
    font-size: .86rem;
    color: var(--metin-soluk);
}

/* Konu listesi */

.konu-listesi {
    list-style: none;
    margin: 0;
    padding: 0;
}

.konu-listesi li { border-top: 1px solid var(--cizgi); }
.konu-listesi li:first-child { border-top: 0; }

.konu-listesi a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 9px 0;
    font-size: .97rem;
    font-weight: 600;
}

.konu-listesi a:hover { color: var(--vurgu); }

.konu-listesi .adet {
    font-size: .86rem;
    font-weight: 600;
    color: var(--metin-soluk);
    background: var(--zemin);
    border: 1px solid var(--cizgi);
    border-radius: 999px;
    padding: 1px 8px;
}

/* Etiket bulutu */

.etiket-bulutu {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.bulut-etiket {
    font-size: .86rem;
    font-weight: 600;
    color: var(--lacivert);
    background: var(--zemin);
    border: 1px solid var(--cizgi);
    border-radius: 999px;
    padding: 3px 10px;
}

@media (prefers-color-scheme: dark) {
    :where(:root:not([data-tema="acik"])) .bulut-etiket { color: var(--metin); }
}

:where(:root[data-tema="koyu"]) .bulut-etiket { color: var(--metin); }

/* --- Alt pencereler: konu bloklari --------------------------------------- */

.alt-pencereler {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 20px;
    margin-bottom: 36px;
}

.blok-baslik {
    margin: 0 0 12px;
    padding-bottom: 10px;
    border-bottom: 2px solid var(--altin);
    font-size: .90rem;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--lacivert);
}

@media (prefers-color-scheme: dark) {
    :where(:root:not([data-tema="acik"])) .blok-baslik { color: var(--altin); }
}

:where(:root[data-tema="koyu"]) .blok-baslik { color: var(--altin); }

.blok-baslik a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.blok-baslik .devam {
    font-size: .80rem;
    letter-spacing: .04em;
    text-transform: none;
    color: var(--metin-soluk);
    white-space: nowrap;
}

.blok-one-cikan { display: block; }

.blok-one-cikan img {
    width: 100%;
    height: 132px;
    object-fit: cover;
    /* Dar kutu: kirpma ustten agir olsun, yuzler kesilmesin. */
    object-position: center 25%;
    border-radius: 6px;
    margin-bottom: 10px;
}

.blok-one-cikan h4 {
    margin: 0 0 5px;
    font-size: 1rem;
    line-height: 1.32;
}

.blok-one-cikan:hover h4 { color: var(--vurgu); }

.blok-one-cikan p {
    margin: 0;
    font-size: .94rem;
    color: var(--metin-soluk);
    line-height: 1.45;
}

.blok-liste {
    list-style: none;
    margin: 12px 0 0;
    padding: 0;
}

.blok-liste li {
    border-top: 1px solid var(--cizgi);
    padding: 9px 0 0;
    margin-top: 9px;
}

.blok-liste li:first-child { margin-top: 0; }

.blok-liste a {
    font-size: .96rem;
    font-weight: 600;
    line-height: 1.35;
    position: relative;
    padding-left: 13px;
    display: block;
}

.blok-liste a::before {
    content: "";
    position: absolute;
    left: 0;
    top: .52em;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--altin);
}

.blok-liste a:hover { color: var(--vurgu); }

/* --- Daraltilmis ekranlar ------------------------------------------------- */

@media (max-width: 980px) {
    .ana-duzen {
        grid-template-columns: 1fr;
    }

    .yan-pencere {
        position: static;
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    }
}

/* --- Piyasa seridi -------------------------------------------------------- */

.piyasa-serit {
    background: var(--lacivert);
    border-radius: var(--yuvarlak);
    margin: 0 0 8px;
    overflow: hidden;
    /* Icerik sigmadiginda kaysin diye tasma gizleniyor. */
}

.piyasa-akis {
    display: flex;
    width: 100%;
}

.piyasa-grup {
    display: flex;
    align-items: center;
    gap: 26px;
    padding: 11px 18px;
    white-space: nowrap;
    flex: 0 0 auto;
    min-width: 100%;
    justify-content: space-around;
}

.piyasa-oge {
    display: inline-flex;
    align-items: baseline;
    gap: 8px;
}

.piyasa-oge .ad {
    font-size: .80rem;
    font-weight: 700;
    letter-spacing: .1em;
    color: var(--altin);
}

.piyasa-oge .deger {
    font-size: 1.04rem;
    font-weight: 700;
    color: #fff;
    font-variant-numeric: tabular-nums;
}

.piyasa-oge .degisim {
    font-size: .86rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.piyasa-oge .degisim.arti   { color: #57d38c; }
.piyasa-oge .degisim.eksi   { color: #ff8a80; }
.piyasa-oge .degisim.duraan { color: #b9c8dd; }

/*
 * Degisim bilinmiyorsa kutu hic yer kaplamasin.
 *
 * Bos bir span, yanindaki bosluk kadar aralik birakip seridi
 * duzensiz gosterirdi. Referans olusmadan (ilk gun) bu durum
 * yasaniyor.
 */
.piyasa-oge .degisim.bos { display: none; }

.piyasa-zaman .deger {
    font-size: .90rem;
    font-weight: 600;
    color: #b9c8dd;
}

/*
 * Dar ekranda kaydir.
 *
 * Genis ekranda degerler zaten sigiyor ve surekli kayan bir cubuk
 * okumayi zorlastiriyor; kayma yalnizca sigmadigi yerde aciliyor.
 * Ikinci grup kopyasi kesintisiz donguyu saglar.
 */
@media (max-width: 720px) {
    .piyasa-grup {
        min-width: auto;
        justify-content: flex-start;
        gap: 22px;
        padding-right: 22px;
    }

    /* Iki kopya yan yana; -%50 tam bir kopya demek, dongu ziplamadan doner. */
    .piyasa-akis {
        width: max-content;
        animation: piyasa-kay 26s linear infinite;
    }

    .piyasa-serit:hover .piyasa-akis,
    .piyasa-serit:focus-within .piyasa-akis {
        animation-play-state: paused;
    }
}

/* Genis ekranda ikinci kopya gereksiz; deger zaten sigiyor. */
@media (min-width: 721px) {
    .piyasa-grup[aria-hidden="true"] { display: none; }
}

@keyframes piyasa-kay {
    from { transform: translateX(0); }
    to   { transform: translateX(-50%); }
}

@media (prefers-reduced-motion: reduce) {
    .piyasa-akis { animation: none; }
    .piyasa-grup[aria-hidden="true"] { display: none; }
}

/* --- Kanun listesi -------------------------------------------------------- */

.kanun-listesi {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 16px;
}

.kanun {
    background: var(--kart);
    border-radius: var(--yuvarlak);
    box-shadow: var(--golge);
    transition: transform .15s ease, box-shadow .15s ease;
}

.kanun:hover {
    transform: translateY(-2px);
    box-shadow: 0 2px 4px rgba(20, 33, 58, .07), 0 10px 26px rgba(20, 33, 58, .1);
}

.kanun > a {
    display: block;
    padding: 18px 20px 16px;
    border-top: 3px solid var(--altin);
    border-radius: var(--yuvarlak);
}

.kanun-ust {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 8px;
}

.kanun-ust h3 {
    margin: 0;
    font-size: 1.08rem;
    line-height: 1.3;
}

.kanun:hover h3 { color: var(--vurgu); }

.kanun-no {
    font-size: .82rem;
    font-weight: 700;
    color: var(--metin-soluk);
    white-space: nowrap;
}

.kanun p {
    margin: 0 0 12px;
    font-size: .96rem;
    color: var(--metin-soluk);
    line-height: 1.5;
}

.kanun-bag {
    font-size: .90rem;
    font-weight: 700;
    color: var(--vurgu);
}

/* --- Kanun metni sayfasi -------------------------------------------------- */

.kanun-basligi {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 18px;
    flex-wrap: wrap;
    margin: 24px 0 16px;
}

.kanun-basligi .geri {
    font-size: .90rem;
    font-weight: 600;
    color: var(--metin-soluk);
}

.kanun-basligi .geri:hover { color: var(--vurgu); }

.kanun-basligi h1 {
    margin: 6px 0 4px;
    font-size: clamp(1.35rem, 2.6vw, 1.9rem);
    line-height: 1.2;
}

.kanun-basligi p {
    margin: 0;
    font-size: .96rem;
    color: var(--metin-soluk);
}

.kanun-basligi .dis-bag {
    background: var(--lacivert);
    color: #fff;
    font-size: .94rem;
    font-weight: 700;
    padding: 9px 16px;
    border-radius: 6px;
    white-space: nowrap;
}

.kanun-basligi .dis-bag:hover { background: var(--lacivert-acik); }

.kanun-uyari {
    background: #fdf0ef;
    border: 1px solid #f3c9c5;
    color: #8c2f27;
    border-radius: var(--yuvarlak);
    padding: 14px 18px;
    margin-bottom: 14px;
    font-size: .98rem;
}

.kanun-uyari a { text-decoration: underline; }

@media (prefers-color-scheme: dark) {
    :where(:root:not([data-tema="acik"])) .kanun-uyari { background: #2d1a18; border-color: #5a2a25; color: #f3b5ae; }
}

:where(:root[data-tema="koyu"]) .kanun-uyari { background: #2d1a18; border-color: #5a2a25; color: #f3b5ae; }

/*
 * Kanun metni.
 *
 * Metin resmi kaynaktan geldigi icin kendi bicimlendirmesini tasiyor
 * ama nitelikleri ayiklandi; burada okunabilir bir tipografi
 * veriliyor. Satir uzunlugu sinirli: kanun metinleri uzun, ekran
 * genisligince akan satirlari izlemek yoruyor.
 */
.kanun-metin {
    background: var(--kart);
    border: 1px solid var(--cizgi);
    border-radius: var(--yuvarlak);
    box-shadow: var(--golge);
    padding: 30px 34px;
    max-width: 78ch;
    margin: 0 auto;
    font-size: 1.02rem;
    line-height: 1.7;
    overflow-wrap: break-word;
}

.kanun-metin p { margin: 0 0 14px; }

.kanun-metin h1,
.kanun-metin h2,
.kanun-metin h3,
.kanun-metin h4 {
    margin: 26px 0 10px;
    font-size: 1.08rem;
    line-height: 1.35;
    color: var(--lacivert);
}

@media (prefers-color-scheme: dark) {
    :where(:root:not([data-tema="acik"])) .kanun-metin h1,
    :where(:root:not([data-tema="acik"])) .kanun-metin h2,
    :where(:root:not([data-tema="acik"])) .kanun-metin h3,
    :where(:root:not([data-tema="acik"])) .kanun-metin h4 { color: var(--altin); }
}

:where(:root[data-tema="koyu"]) .kanun-metin h1,
:where(:root[data-tema="koyu"]) .kanun-metin h2,
:where(:root[data-tema="koyu"]) .kanun-metin h3,
:where(:root[data-tema="koyu"]) .kanun-metin h4 { color: var(--altin); }

.kanun-metin b,
.kanun-metin strong { color: var(--metin); }

.kanun-metin ul,
.kanun-metin ol { margin: 0 0 14px; padding-left: 22px; }

.kanun-metin li { margin-bottom: 6px; }

/* Kaynaktaki tablolar dar ekranda tasmasin. */
.kanun-metin table {
    width: 100%;
    border-collapse: collapse;
    margin: 0 0 16px;
    font-size: .96rem;
    display: block;
    overflow-x: auto;
}

.kanun-metin td,
.kanun-metin th {
    border: 1px solid var(--cizgi);
    padding: 6px 9px;
    vertical-align: top;
}

.kanun-kaynak {
    margin: 14px auto 34px;
    max-width: 78ch;
}

@media (max-width: 700px) {
    .kanun-metin { padding: 20px 18px; }
}

/* --- Pratik bilgiler ------------------------------------------------------ */

.pratik-izgara {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 16px;
    margin-bottom: 8px;
}

.pratik-kart {
    background: var(--kart);
    border-radius: var(--yuvarlak);
    box-shadow: var(--golge);
    border-top: 3px solid var(--altin);
    padding: 16px 18px 14px;
    display: flex;
    flex-direction: column;
}

.pratik-kart h3 {
    margin: 0 0 10px;
    font-size: 1.04rem;
    line-height: 1.3;
}

/*
 * Deger <pre> icinde: kimi bilgi tek satir (asgari ucret), kimi tablo
 * (gelir vergisi tarifesi). Satir sonlari korunmali ama uzun satir da
 * tasmamali.
 */
.pratik-deger {
    margin: 0 0 10px;
    font-family: inherit;
    font-size: 1.08rem;
    font-weight: 700;
    line-height: 1.45;
    white-space: pre-wrap;
    word-break: break-word;
    color: var(--lacivert);
}

@media (prefers-color-scheme: dark) {
    :where(:root:not([data-tema="acik"])) .pratik-deger { color: var(--metin); }
}

:where(:root[data-tema="koyu"]) .pratik-deger { color: var(--metin); }

.pratik-alt {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: auto;
    padding-top: 10px;
    border-top: 1px solid var(--cizgi);
    font-size: .86rem;
}

.pratik-alt .donem {
    font-weight: 700;
    color: var(--altin-koyu);
}

.pratik-alt a { color: var(--metin-soluk); }
.pratik-alt a:hover { color: var(--vurgu); }

.pratik-tarih {
    display: block;
    margin-top: 6px;
    font-size: .82rem;
    color: var(--metin-soluk);
}

/*
 * Metin getirilemediginde gosterilen panel.
 *
 * Bilerek hata rengi kullanilmiyor. Ziyaretci acisindan burada bozulan
 * bir sey yok: aradigi metin duruyor, yalnizca baska bir adreste. Kirmizi
 * bir serit sayfayi arizali gosteriyordu; bu panel ise calisan iki yolu
 * one cikariyor.
 */
.kanun-duser {
    background: var(--kart);
    border: 1px solid var(--cizgi);
    border-radius: var(--yuvarlak);
    box-shadow: var(--golge);
    border-top: 3px solid var(--altin);
    padding: 40px 28px 34px;
    margin: 18px 0 8px;
    text-align: center;
}

.kanun-duser-simge {
    width: 40px;
    height: 40px;
    fill: none;
    stroke: var(--altin-koyu);
    stroke-width: 1.5;
    stroke-linecap: round;
    stroke-linejoin: round;
    margin-bottom: 12px;
}

.kanun-duser h2 {
    margin: 0 0 8px;
    font-size: 1.28rem;
}

.kanun-duser > p {
    margin: 0 auto 20px;
    max-width: 56ch;
    font-size: .99rem;
    line-height: 1.6;
    color: var(--metin-soluk);
}

.kanun-duser-yollar {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 10px;
}

.kanun-duser-yollar a {
    font-size: .96rem;
    font-weight: 700;
    padding: 11px 20px;
    border-radius: 6px;
    white-space: nowrap;
}

.dugme-birincil {
    background: var(--lacivert);
    color: #fff;
}

.dugme-birincil:hover { background: var(--lacivert-acik); }

.dugme-ikincil {
    border: 1px solid var(--cizgi);
    color: var(--metin);
}

.dugme-ikincil:hover { border-color: var(--lacivert); color: var(--vurgu); }

.kanun-duser-not {
    margin: 20px auto 0;
    max-width: 56ch;
    font-size: .90rem;
    color: var(--metin-soluk);
}

.kanun-duser-not a { color: var(--vurgu); text-decoration: underline; }

/* Kanun sayfasindaki yonetici tanisi: ziyaretciye gorunmez.
   Acilir blok: kapaliyken sayfayi bozmuyor, acilinca ayrintiyi veriyor. */
.kanun-tani {
    margin: 22px auto 0;
    max-width: 70ch;
    text-align: left;
    font-size: .90rem;
    border: 1px dashed var(--cizgi);
    border-radius: 8px;
    padding: 10px 14px;
    color: var(--metin-soluk);
}

.kanun-tani summary {
    cursor: pointer;
    font-weight: 700;
    color: var(--metin);
}

.kanun-tani p {
    margin: 8px 0 0;
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    line-height: 1.55;
    word-break: break-word;
}

/* Kanun metni PDF olarak geldiginde sayfanin icinde acilir.
   Yukseklik ekrana gore: kisa bir kutuda kanun okumak zor. */
.kanun-pdf {
    width: 100%;
    height: calc(100vh - 220px);
    min-height: 480px;
    border: 1px solid var(--cizgi);
    border-radius: 10px;
    background: #fff;
}

.kanun-tani-bag {
    margin-left: 8px;
    font-size: .9rem;
    opacity: .75;
}

/* --- Pratik bilgiler: liste ve detay ------------------------------------- */

/*
 * Giris sayfasi liste, kart degil.
 *
 * Degerlerin bir kismi tek rakam ("12.000 TL"), bir kismi onlarca
 * satirlik tarife. Kart duzeninde uzun olanlar sayfayi kilometrelerce
 * uzatiyor, kisa olanlar aralarinda kayboluyordu. Listede hepsi ayni
 * yuksekligi kapliyor ve goz basliklar arasinda hizlica geziyor;
 * degerin tamami kendi sayfasinda.
 */
.pratik-liste {
    list-style: none;
    margin: 0 0 26px;
    padding: 0;
    background: var(--kart);
    border-radius: var(--yuvarlak);
    box-shadow: var(--golge);
    overflow: hidden;
}

.pratik-liste li + li { border-top: 1px solid var(--cizgi); }

.pratik-liste a {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 16px;
    padding: 14px 18px;
    transition: background .12s ease;
}

.pratik-liste a:hover { background: var(--zemin); }

.pratik-liste-ad {
    font-weight: 600;
    color: var(--metin);
    min-width: 0;
}

.pratik-liste a:hover .pratik-liste-ad { color: var(--vurgu); }

.pratik-liste-ad small {
    display: block;
    font-weight: 400;
    font-size: .86rem;
    color: var(--metin-soluk);
    margin-top: 2px;
}

.pratik-liste-deger {
    color: var(--metin-soluk);
    font-size: .96rem;
    text-align: right;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

@media (max-width: 560px) {
    .pratik-liste a { flex-direction: column; gap: 4px; }
    .pratik-liste-deger { text-align: left; white-space: normal; }
}

.pratik-detay {
    background: var(--kart);
    border-radius: var(--yuvarlak);
    box-shadow: var(--golge);
    border-top: 3px solid var(--altin);
    padding: 26px 28px 24px;
    margin: 18px 0 0;
}

.pratik-detay .geri {
    font-size: .90rem;
    font-weight: 600;
    color: var(--metin-soluk);
}

.pratik-detay .geri:hover { color: var(--vurgu); }

.pratik-detay h1 {
    margin: 8px 0 6px;
    font-size: clamp(1.3rem, 2.4vw, 1.8rem);
    line-height: 1.25;
}

.pratik-detay-aciklama {
    margin: 0 0 18px;
    color: var(--metin-soluk);
    font-size: .99rem;
}

/* Degerin kendisi sayfanin ana konusu: buyuk ve okunakli. */
.pratik-deger-kutu {
    background: var(--zemin);
    border-radius: 8px;
    padding: 18px 20px;
    margin-bottom: 18px;
}

.pratik-deger-baslik {
    margin: 16px 0 8px;
    font-size: .94rem;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--metin-soluk);
}

.pratik-deger-baslik:first-child { margin-top: 0; }

.pratik-deger-satir {
    margin: 0 0 6px;
    font-size: 1.10rem;
    font-weight: 600;
    line-height: 1.5;
    color: var(--metin);
}

/* Tek satirlik degerler (bir rakam) daha buyuk dursun. */
.pratik-deger-satir:only-child { font-size: 1.5rem; }

.pratik-kunye {
    display: flex;
    flex-wrap: wrap;
    gap: 22px;
    margin: 0 0 16px;
}

.pratik-kunye dt {
    font-size: .82rem;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--metin-soluk);
    margin-bottom: 3px;
}

.pratik-kunye dd {
    margin: 0;
    font-size: .98rem;
    color: var(--metin);
}

.pratik-kunye a { color: var(--vurgu); }

/*
 * Yuklenen suret uyarisi.
 *
 * Ziyaretci yururlukteki metne mi yoksa bir kopyaya mi baktigini
 * bilmeli; bu yuzden metnin USTUNDE ve goz ardi edilemeyecek kadar
 * belirgin duruyor. Hata rengi degil uyari rengi: bozulan bir sey yok,
 * dikkat edilmesi gereken bir sey var.
 */
.kanun-kopya-uyari {
    background: #fff8e8;
    border: 1px solid #e8d5a8;
    border-left: 4px solid var(--altin-koyu);
    border-radius: 8px;
    padding: 12px 16px;
    margin: 0 0 14px;
    font-size: .96rem;
    line-height: 1.6;
    color: #6b5322;
}

.kanun-kopya-uyari a { color: var(--vurgu); text-decoration: underline; }

@media (prefers-color-scheme: dark) {
    :where(:root:not([data-tema="acik"])) .kanun-kopya-uyari {
        background: #2a2314;
        border-color: #4d3f22;
        color: #e8d3a4;
    }
}

:where(:root[data-tema="koyu"]) .kanun-kopya-uyari {
    background: #2a2314;
    border-color: #4d3f22;
    color: #e8d3a4;
}

/* --- Yaklasan Tarihler (yan pencere) ------------------------------------- */

.takvim-listesi {
    list-style: none;
    margin: 0;
    padding: 0;
}

.takvim-listesi li {
    display: grid;
    /* Gun kutusu sabit; baslik esner; kalan gun sagda hizali durur. */
    grid-template-columns: 44px minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    padding: 11px 0;
    border-top: 1px solid var(--cizgi);
}

.takvim-listesi li:first-child { border-top: 0; }

.takvim-gun {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 5px 0;
    border-radius: 8px;
    background: var(--lacivert);
    color: #fff;
    line-height: 1.1;
}

.takvim-gun strong {
    font-size: 1.05rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.takvim-gun span {
    font-size: .6rem;
    letter-spacing: .06em;
    text-transform: uppercase;
    opacity: .85;
}

.takvim-yazi { display: flex; flex-direction: column; min-width: 0; }

.takvim-yazi .ad {
    font-size: .88rem;
    font-weight: 600;
    line-height: 1.3;
}

.takvim-yazi .ust-bilgi {
    margin-top: 2px;
    font-size: .74rem;
    color: var(--metin-soluk);
}

.takvim-kalan {
    font-size: .72rem;
    font-weight: 600;
    color: var(--metin-soluk);
    white-space: nowrap;
}

.pencere-not {
    margin: 12px 0 0;
    font-size: .72rem;
    line-height: 1.5;
    color: var(--metin-soluk);
}

.pencere-not a { color: var(--vurgu); text-decoration: underline; }

/* --- Vergi takvimi sayfasi ----------------------------------------------- */

.takvim-vurgu {
    margin: 0 0 30px;
    padding: 20px 22px;
    background: var(--kart);
    border-radius: var(--yuvarlak);
    box-shadow: var(--golge);
}

.takvim-vurgu h2 {
    margin: 0 0 14px;
    font-size: 1.05rem;
    font-weight: 700;
}

.takvim-vurgu-liste {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
    gap: 14px;
}

.takvim-vurgu-oge {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr);
    gap: 12px;
    align-items: center;
}

/* Aylar: genis ekranda dort, sonra uc ve iki sutun. */
.takvim-yil {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 20px;
}

@media (max-width: 1200px) { .takvim-yil { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 860px)  { .takvim-yil { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px)  { .takvim-yil { grid-template-columns: 1fr; } }

.takvim-ay {
    background: var(--kart);
    border-radius: var(--yuvarlak);
    box-shadow: var(--golge);
    padding: 16px 18px 14px;
}

/*
 * Gecmis aylar soluk ama GIZLI DEGIL: okuyucu "gecen ay neyi
 * kacirdim" diye de bakiyor.
 */
.takvim-ay.gecmis { opacity: .62; }

.takvim-ay.su-anki {
    outline: 2px solid var(--altin);
    outline-offset: -2px;
}

.takvim-ay h2 {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 12px;
    font-size: 1rem;
    font-weight: 700;
}

.takvim-ay .rozet {
    padding: 2px 8px;
    border-radius: 999px;
    background: var(--altin);
    color: #3c2d10;
    font-size: .62rem;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.takvim-ay-liste { list-style: none; margin: 0; padding: 0; }

.takvim-ay-liste li {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    gap: 10px;
    padding: 8px 0;
    border-top: 1px solid var(--cizgi);
}

.takvim-ay-liste li:first-child { border-top: 0; }

/* Suresi gecmis yukumluluk ustu cizili degil, yalnizca soluk:
   ustu cizgi "iptal edildi" izlenimi verirdi. */
.takvim-ay-liste li.oldu { opacity: .5; }

.takvim-ay-liste .gun {
    font-size: .95rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    color: var(--vurgu);
    text-align: right;
}

.takvim-ay-liste .yazi { display: flex; flex-direction: column; min-width: 0; }
.takvim-ay-liste .ad { font-size: .84rem; font-weight: 600; line-height: 1.3; }

.takvim-ay-liste .ust-bilgi {
    margin-top: 2px;
    font-size: .72rem;
    color: var(--metin-soluk);
}

.takvim-bos {
    margin: 0;
    font-size: .8rem;
    color: var(--metin-soluk);
}

.takvim-yil-gecis {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 18px;
    margin: 30px 0;
    font-weight: 600;
}

.takvim-yil-gecis a { color: var(--vurgu); }
.takvim-yil-gecis span { color: var(--metin-soluk); }

/* Kunyede hazirlayan adi one ciksin: guven olcutu. */
.kunye .hazirlayan {
    font-weight: 700;
    color: var(--metin);
}

/* --- Valentra Analiz ----------------------------------------------------- */

.analiz {
    margin: 0 0 26px;
    padding: 20px 22px 6px;
    border-radius: var(--yuvarlak);
    background: var(--kart);
    /* Sol kenardaki altin serit blogu haber metninden ayiriyor:
       bu bizim degerlendirmemiz, kaynagin metni degil. */
    border-left: 4px solid var(--altin);
    box-shadow: var(--golge);
}

.analiz-baslik {
    margin: 0 0 14px;
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--altin-koyu);
}

.analiz-liste { margin: 0; }

.analiz-oge {
    display: grid;
    grid-template-columns: 200px minmax(0, 1fr);
    gap: 16px;
    padding: 11px 0;
    border-top: 1px solid var(--cizgi);
}

.analiz-oge:first-child { border-top: 0; }

.analiz-oge dt {
    font-size: .86rem;
    font-weight: 700;
    color: var(--metin);
}

.analiz-oge dd {
    margin: 0;
    font-size: .92rem;
    line-height: 1.6;
    color: var(--metin);
}

/* Dar ekranda soru ve cevap alt alta; 200px'lik sutun sigmiyor. */
@media (max-width: 620px) {
    .analiz-oge {
        grid-template-columns: 1fr;
        gap: 4px;
    }
}

@media (prefers-color-scheme: dark) {
    :where(:root:not([data-tema="acik"])) .analiz-baslik { color: var(--altin); }
}

:where(:root[data-tema="koyu"]) .analiz-baslik { color: var(--altin); }

/* dd icindeki bicimli metin: paragraf ve kontrol listesi bosluk birakmasin. */
.analiz-oge dd > p { margin: 0; }
.analiz-oge dd > p + p { margin-top: .5em; }
.analiz-oge dd > ul { margin: 0; padding-left: 1.2em; }
.analiz-oge dd li + li { margin-top: 3px; }

/* --- Uygulama ornegi (haber) ---------------------------------------------- */

.uygulama-ornegi {
    margin: 0 0 26px;
    padding: 18px 22px 14px;
    border-radius: var(--yuvarlak);
    background: var(--zemin);
    border: 1px dashed var(--altin);
}

.uygulama-ornegi h2 {
    margin: 0 0 10px;
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--altin-koyu);
}

.uygulama-ornegi p { margin: 0 0 .7em; font-size: .95rem; }

.uygulama-ornegi ul {
    margin: 0 0 .7em;
    padding-left: 1.2em;
    font-size: .95rem;
    font-variant-numeric: tabular-nums;
}

.uygulama-ornegi .uygulama-not {
    margin: 6px 0 0;
    font-size: .8rem;
    color: var(--metin-soluk);
    font-style: italic;
}

/* --- Kaynak ve tarihler (haber) -------------------------------------------- */

.kaynak-tarih {
    margin-top: 28px;
    padding: 14px 18px;
    border: 1px solid var(--cizgi);
    border-radius: 8px;
    font-size: .92rem;
}

.kaynak-tarih h2 {
    margin: 0 0 8px;
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--metin-soluk);
}

.kaynak-tarih dl { margin: 0; }

.kaynak-tarih dl > div {
    display: grid;
    grid-template-columns: 150px minmax(0, 1fr);
    gap: 12px;
    padding: 5px 0;
}

.kaynak-tarih dt { font-weight: 600; color: var(--metin-soluk); }
.kaynak-tarih dd { margin: 0; color: var(--metin); }
.kaynak-tarih a { color: var(--vurgu); text-decoration: underline; }

.kaynak-tarih-not {
    margin: 8px 0 0;
    font-size: .82rem;
    color: var(--metin-soluk);
}

/* Kaynak adi ve "haberin tamami" dugmesi: ozetin hemen altinda, okuyucu
   kaynaga tek tikla gidebilsin. */
.kaynak-tarih-ad {
    margin: 0 0 10px;
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--metin);
}

.kaynak-tarih .kaynak-tarih-dugme {
    display: inline-block;
    margin: 0 0 12px;
    padding: 10px 16px;
    border-radius: 6px;
    background: var(--lacivert);
    color: #fff;
    font-weight: 600;
    text-decoration: none;
    overflow-wrap: anywhere;
}

.kaynak-tarih .kaynak-tarih-dugme:hover { background: var(--lacivert-acik); }

@media (max-width: 620px) {
    .kaynak-tarih dl > div { grid-template-columns: 1fr; gap: 0; }
}

@media (prefers-color-scheme: dark) {
    :where(:root:not([data-tema="acik"])) .uygulama-ornegi h2 { color: var(--altin); }
}

:where(:root[data-tema="koyu"]) .uygulama-ornegi h2 { color: var(--altin); }

/* --- Ana sayfadaki Valentra Analiz kartlari ------------------------------ */

.analiz-kartlari {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
    margin-bottom: 34px;
}

@media (max-width: 1100px) { .analiz-kartlari { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 700px)  { .analiz-kartlari { grid-template-columns: 1fr; } }

.analiz-kart {
    background: var(--kart);
    border-radius: var(--yuvarlak);
    border-left: 4px solid var(--altin);
    box-shadow: var(--golge);
    transition: transform .15s ease, box-shadow .15s ease;
}

.analiz-kart:hover {
    transform: translateY(-2px);
    box-shadow: 0 2px 4px rgba(16, 20, 28, .08), 0 10px 24px rgba(16, 20, 28, .1);
}

.analiz-kart > a {
    display: flex;
    flex-direction: column;
    height: 100%;
    padding: 18px 20px 16px;
}

.analiz-kart h3 {
    margin: 10px 0 14px;
    font-size: 1.02rem;
    font-weight: 700;
    line-height: 1.35;
}

.analiz-ozet { margin: 0 0 14px; }

.analiz-ozet > div + div { margin-top: 10px; }

.analiz-ozet dt {
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--altin-koyu);
}

.analiz-ozet dd {
    margin: 2px 0 0;
    font-size: .86rem;
    line-height: 1.5;
    color: var(--metin-soluk);
}

.analiz-devam {
    margin-top: auto;
    font-size: .8rem;
    font-weight: 600;
    color: var(--vurgu);
}

@media (prefers-color-scheme: dark) {
    :where(:root:not([data-tema="acik"])) .analiz-ozet dt { color: var(--altin); }
}

:where(:root[data-tema="koyu"]) .analiz-ozet dt { color: var(--altin); }

/* --- Resmi Gazete sayfasi ------------------------------------------------ */

.rg-gunler {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 18px 0 0;
}

.rg-gunler a {
    padding: 5px 12px;
    border: 1px solid var(--cizgi);
    border-radius: 999px;
    background: var(--kart);
    color: var(--metin-soluk);
    font-size: .88rem;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

.rg-gunler a:hover { color: var(--vurgu); border-color: var(--vurgu); }

.rg-gunler a.aktif {
    background: var(--lacivert);
    border-color: var(--lacivert);
    color: #fff;
}

.rg-kunye {
    background: var(--kart);
    border-radius: var(--yuvarlak);
    box-shadow: var(--golge);
    border-top: 3px solid var(--altin);
    padding: 20px 24px 18px;
    margin: 18px 0 0;
}

.rg-kunye-ust {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 4px 14px;
}

.rg-tarih { font-size: 1.25rem; font-weight: 800; }

.rg-sayi {
    color: var(--metin-soluk);
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

.rg-uyari {
    margin: 8px 0 0;
    font-size: .92rem;
    color: var(--altin-koyu);
}

.rg-ozet { margin: 10px 0 0; }

.rg-bolum-sayilari {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 12px 0 0;
    padding: 0;
}

.rg-bolum-sayilari li {
    padding: 4px 10px;
    border-radius: 6px;
    background: var(--zemin);
    font-size: .9rem;
    color: var(--metin-soluk);
}

.rg-bolum-sayilari strong { color: var(--metin); margin-left: 4px; }

.rg-bolum {
    margin: 18px 0 8px;
    font-size: 1.02rem;
    font-weight: 700;
    color: var(--metin);
}

.rg-liste {
    list-style: none;
    margin: 0 0 8px;
    padding: 0;
    background: var(--kart);
    border-radius: var(--yuvarlak);
    box-shadow: var(--golge);
    overflow: hidden;
}

.rg-liste li { padding: 12px 18px; }

.rg-liste li + li { border-top: 1px solid var(--cizgi); }

.rg-madde {
    display: block;
    font-weight: 600;
    color: var(--metin);
    overflow-wrap: anywhere;
}

a.rg-madde:hover { color: var(--vurgu); }

.rg-rozet {
    display: inline-block;
    margin-left: 6px;
    padding: 0 6px;
    border: 1px solid var(--cizgi);
    border-radius: 4px;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .04em;
    color: var(--metin-soluk);
    vertical-align: 2px;
}

.rg-haber {
    display: inline-block;
    margin-top: 4px;
    font-size: .9rem;
    font-weight: 600;
    color: var(--vurgu);
}

.rg-haber:hover { text-decoration: underline; }

.rg-dis { color: var(--vurgu); text-decoration: underline; }

.rg-not { margin: 18px 0 8px; }

@media (prefers-color-scheme: dark) {
    :where(:root:not([data-tema="acik"])) .rg-uyari { color: var(--altin); }
    :where(:root:not([data-tema="acik"])) .rg-gunler a.aktif { background: var(--vurgu); border-color: var(--vurgu); color: #0d1522; }
}

:where(:root[data-tema="koyu"]) .rg-uyari { color: var(--altin); }
:where(:root[data-tema="koyu"]) .rg-gunler a.aktif { background: var(--vurgu); border-color: var(--vurgu); color: #0d1522; }

/* --- Valentra Diyor ki... (kose yazilari) -------------------------------- */

/*
 * Yan pencerenin en ustundeki kutu (22.10.2026'ya kadar ana sayfada
 * mansetle ayni siradaydi). Gorunum oteki pencerelerle ayni
 * (.pencere + .sirali-liste); kutu kendi boyunda, yazilar kirpilmiyor.
 */
.kose-kutu { min-width: 0; }

.kose-kutu-baslik {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
}

.kose-kutu-baslik span {
    font-size: .72rem;
    font-weight: 600;
    letter-spacing: 0;
    text-transform: none;
    color: var(--metin-soluk);
    white-space: nowrap;
}

/* Baslik en fazla iki, konu tek satir, aralik biraz daha sik. */
.kose-kutu .pencere-baslik { margin-bottom: 8px; }

.kose-kutu .sirali-liste li { padding: 8px 0; }

.kose-kutu .sirali-liste li:first-child { padding-top: 2px; }

/* Baglanti flex ogesi: min-width olmadan daralmiyor ve uzun basliklar
   satir kirmak yerine kutunun sag kenarindan tasip kesiliyordu. */
.kose-kutu .sirali-liste a { min-width: 0; flex: 1 1 auto; }

.kose-kutu .ad {
    font-size: .94rem;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.kose-kutu .ust-bilgi {
    margin-top: 1px;
    font-size: .8rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.kose-kutu-tumu {
    margin: 10px 0 0;
    padding-top: 10px;
    border-top: 1px solid var(--cizgi);
    font-size: .8rem;
}

.kose-kutu-tumu a {
    font-weight: 700;
    color: var(--vurgu);
}

.kose-kutu-tumu a:hover { text-decoration: underline; }

.kose-gundem {
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--altin-koyu);
}

.kose-baslik {
    font-weight: 700;
    line-height: 1.35;
    color: var(--metin);
}

.kose-liste a:hover .kose-baslik { color: var(--vurgu); }

.kose-ozet {
    font-size: .86rem;
    line-height: 1.45;
    color: var(--metin-soluk);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Tum yazilar listesi ve "gunun diger yazilari" */
.kose-liste {
    list-style: none;
    margin: 0 0 26px;
    padding: 0 18px;
    background: var(--kart);
    border-radius: var(--yuvarlak);
    box-shadow: var(--golge);
}

.kose-liste li + li { border-top: 1px solid var(--cizgi); }

.kose-liste a {
    display: flex;
    flex-direction: column;
    gap: 3px;
    padding: 14px 0;
}

.kose-liste .kose-ozet { -webkit-line-clamp: 3; font-size: .92rem; }

/* Yazi sayfasi */
.kose-ust-etiket {
    display: inline-block;
    margin-bottom: 12px;
    font-size: .82rem;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--altin-koyu);
}

.kose-detay .icerik h2 {
    margin: 1.6em 0 .6em;
    font-size: 1.25rem;
    font-weight: 800;
    line-height: 1.3;
}

.kose-detay .icerik ul { margin: 0 0 1.05em; padding-left: 1.3em; }

.kose-detay .icerik li { margin-bottom: .35em; }

.kose-dayanak {
    margin-top: 28px;
    padding: 16px 20px;
    border-radius: 8px;
    background: var(--zemin);
}

.kose-dayanak h2 {
    margin: 0 0 8px;
    font-size: .92rem;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--metin-soluk);
}

.kose-dayanak ul { margin: 0; padding-left: 1.2em; }

.kose-dayanak li { margin: 4px 0; }

.kose-dayanak a { color: var(--vurgu); text-decoration: underline; }

.kose-dayanak span { color: var(--metin-soluk); font-size: .9rem; }

.kose-not {
    margin: 22px 0 0;
    font-size: .88rem;
    color: var(--metin-soluk);
    font-style: italic;
}

@media (prefers-color-scheme: dark) {
    :where(:root:not([data-tema="acik"])) .kose-gundem,
    :where(:root:not([data-tema="acik"])) .kose-ust-etiket { color: var(--altin); }
}

:where(:root[data-tema="koyu"]) .kose-gundem,
:where(:root[data-tema="koyu"]) .kose-ust-etiket { color: var(--altin); }

/* --- Hesaplama araclari ---------------------------------------------------- */

.arac-kisayol {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 16px 0 18px;
}

.arac-kisayol a {
    padding: 6px 14px;
    border: 1px solid var(--cizgi);
    border-radius: 999px;
    background: var(--kart);
    font-size: .9rem;
    font-weight: 600;
    color: var(--vurgu);
}

.arac-kisayol a:hover { border-color: var(--vurgu); }

.arac-izgara {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
    align-items: start;
}

@media (max-width: 1200px) { .arac-izgara { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px)  { .arac-izgara { grid-template-columns: 1fr; } }

.arac-kart {
    background: var(--kart);
    border-radius: var(--yuvarlak);
    box-shadow: var(--golge);
    border-top: 3px solid var(--altin);
    padding: 18px 20px 16px;
    scroll-margin-top: 16px;
}

.arac-kart h2 { margin: 0 0 4px; font-size: 1.15rem; font-weight: 800; }

.arac-aciklama { margin: 0 0 14px; font-size: .92rem; color: var(--metin-soluk); }

.arac-form { display: grid; gap: 10px; }

.arac-secim { display: grid; gap: 4px; font-size: .92rem; }

.arac-secim label { display: flex; gap: 8px; align-items: center; cursor: pointer; }

.arac-alan { display: grid; gap: 4px; }

/* display:grid, hidden niteligini ezerdi ("Diger" orani secilmedikce gizli). */
.arac-alan[hidden] { display: none; }

.arac-alan span { font-size: .85rem; font-weight: 600; color: var(--metin-soluk); }

.arac-alan input,
.arac-alan select {
    width: 100%;
    padding: 9px 11px;
    border: 1px solid var(--cizgi);
    border-radius: 8px;
    background: var(--zemin);
    color: var(--metin);
    font: inherit;
    font-variant-numeric: tabular-nums;
}

.arac-alan input:focus,
.arac-alan select:focus { outline: 2px solid var(--vurgu); outline-offset: 1px; }

.arac-sonuc {
    margin: 16px 0 0;
    padding: 12px 14px;
    border-radius: 8px;
    background: var(--zemin);
}

.arac-sonuc > div {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 5px 0;
    font-size: .93rem;
}

.arac-sonuc > div + div { border-top: 1px solid var(--cizgi); }

.arac-sonuc dt { color: var(--metin-soluk); }

.arac-sonuc dd {
    margin: 0;
    font-weight: 600;
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.arac-sonuc .arac-toplam dd { font-size: 1.05rem; color: var(--vurgu); }

.arac-not { margin: 12px 0 0; font-size: .8rem; line-height: 1.5; color: var(--metin-soluk); }


/* --- Ust bant: tarih + arama --------------------------------------------- */

.gizli-etiket {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}

.ust-sag {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-left: auto;
}

.ust-sag .ust-bilgi { margin: 0; white-space: nowrap; }

/* Gece / gunduz dugmesi. Koyu temada gunes, acik temada ay gorunuyor:
   dugme gecilecek temayi gosteriyor. */
.tema-dugme {
    flex: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    padding: 0;
    border: 1px solid var(--cizgi);
    border-radius: 999px;
    background: var(--zemin);
    color: var(--metin);
    cursor: pointer;
    transition: border-color .15s ease, color .15s ease;
}

.tema-dugme:hover { border-color: var(--vurgu); color: var(--vurgu); }
.tema-dugme:focus-visible { outline: 2px solid var(--vurgu); outline-offset: 2px; }

.tema-gunes { display: none; }
.tema-dugme[aria-pressed="true"] .tema-ay { display: none; }
.tema-dugme[aria-pressed="true"] .tema-gunes { display: block; }

/* Elle secilen tema form ogelerine ve kaydirma cubuguna da yansisin. */
:root[data-tema="koyu"] { color-scheme: dark; }
:root[data-tema="acik"] { color-scheme: light; }

.ust-arama {
    display: flex;
    align-items: center;
    width: min(340px, 100%);
    border: 1px solid var(--cizgi);
    border-radius: 999px;
    background: var(--zemin);
    transition: border-color .15s ease, box-shadow .15s ease;
}

.ust-arama:focus-within {
    border-color: var(--vurgu);
    box-shadow: 0 0 0 3px rgba(27, 79, 143, .12);
}

.ust-arama input {
    flex: 1;
    min-width: 0;
    height: 38px;
    padding: 0 4px 0 16px;
    border: 0;
    background: transparent;
    color: var(--metin);
    font: inherit;
    font-size: .92rem;
    outline: none;
}

.ust-arama input::-webkit-search-cancel-button { display: none; }

.ust-arama button {
    display: grid;
    place-items: center;
    width: 40px;
    height: 38px;
    border: 0;
    background: transparent;
    color: var(--metin-soluk);
    cursor: pointer;
}

.ust-arama button:hover { color: var(--vurgu); }

@media (max-width: 760px) {
    .ust-sag { width: 100%; margin: 0 0 12px; }
    .ust-sag .ust-bilgi { display: none; }
    .ust-arama { width: 100%; }
}

/* --- Arama sayfasi ------------------------------------------------------- */

.arama-buyuk {
    display: flex;
    gap: 8px;
    max-width: 720px;
    margin: 16px 0 6px;
}

.arama-buyuk input {
    flex: 1;
    min-width: 0;
    height: 48px;
    padding: 0 16px;
    border: 1px solid var(--cizgi);
    border-radius: var(--yuvarlak);
    background: var(--kart);
    color: var(--metin);
    font: inherit;
    font-size: 1.02rem;
}

.arama-buyuk input:focus { outline: 2px solid var(--vurgu); outline-offset: 1px; }

.arama-buyuk button {
    padding: 0 22px;
    border: 0;
    border-radius: var(--yuvarlak);
    background: var(--lacivert);
    color: #fff;
    font: inherit;
    font-weight: 600;
    cursor: pointer;
}

.arama-sonuclari { max-width: 980px; margin-bottom: 40px; }

/* --- Belge turu rozeti (Onemli Duzenlemeler) ----------------------------- */

.belge-turu {
    display: inline-block;
    margin-right: 6px;
    padding: 1px 7px;
    border-radius: 4px;
    background: rgba(201, 168, 106, .20);
    color: var(--altin-koyu);
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    vertical-align: 1px;
}

.belge-turu.notr {
    background: rgba(93, 106, 128, .12);
    color: var(--metin-soluk);
}

@media (prefers-color-scheme: dark) {
    :where(:root:not([data-tema="acik"])) .belge-turu { color: var(--altin); }
}

:where(:root[data-tema="koyu"]) .belge-turu { color: var(--altin); }

/* --- Bugun bilmeniz gerekenler + kisayollar ------------------------------ */

.bugun-bant {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 250px;
    gap: 22px;
    align-items: center;
    margin: 18px 0 4px;
    padding: 16px 18px;
    background: var(--kart);
    border: 1px solid var(--cizgi);
    border-left: 4px solid var(--altin);
    border-radius: var(--yuvarlak);
    box-shadow: var(--golge);
}

.bugun-bant.yalniz-kisayol { grid-template-columns: 1fr; }

.bugun-baslik {
    margin: 0 0 8px;
    font-size: .86rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--lacivert);
}

@media (prefers-color-scheme: dark) {
    :where(:root:not([data-tema="acik"])) .bugun-baslik { color: var(--altin); }
}

:where(:root[data-tema="koyu"]) .bugun-baslik { color: var(--altin); }

.bugun-liste ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.bugun-liste li + li { border-top: 1px dashed var(--cizgi); }

.bugun-liste a {
    display: flex;
    align-items: baseline;
    gap: 10px;
    padding: 6px 0;
    min-width: 0;
}

.bugun-etiket {
    flex: 0 0 auto;
    min-width: 92px;
    font-size: .74rem;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--altin-koyu);
}

.bugun-metin {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: .95rem;
    font-weight: 500;
}

.bugun-liste a:hover .bugun-metin { color: var(--vurgu); }

.bugun-liste li.vurgu .bugun-etiket { color: #b3261e; }
.bugun-liste li.vurgu .bugun-metin { font-weight: 700; }

@media (prefers-color-scheme: dark) {
    :where(:root:not([data-tema="acik"])) .bugun-etiket { color: var(--altin); }
    :where(:root:not([data-tema="acik"])) .bugun-liste li.vurgu .bugun-etiket { color: #ff8a80; }
}

:where(:root[data-tema="koyu"]) .bugun-etiket { color: var(--altin); }
:where(:root[data-tema="koyu"]) .bugun-liste li.vurgu .bugun-etiket { color: #ff8a80; }

.kisayollar {
    display: grid;
    gap: 8px;
}

.bugun-bant.yalniz-kisayol .kisayollar { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.kisayollar a {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    padding: 8px 12px;
    border: 1px solid var(--cizgi);
    border-radius: var(--yuvarlak);
    background: var(--zemin);
    color: var(--lacivert);
    transition: border-color .15s ease, transform .15s ease;
}

.kisayollar a:hover { border-color: var(--altin); transform: translateY(-1px); }

.kisayollar svg { flex: none; color: var(--altin-koyu); }

.kisayollar span { display: flex; flex-direction: column; min-width: 0; }

.kisayollar strong { font-size: .96rem; }

.kisayollar small {
    margin-top: 2px;
    font-size: .80rem;
    color: var(--metin-soluk);
}

@media (prefers-color-scheme: dark) {
    :where(:root:not([data-tema="acik"])) .kisayollar a { color: var(--metin); }
    :where(:root:not([data-tema="acik"])) .kisayollar svg { color: var(--altin); }
}

:where(:root[data-tema="koyu"]) .kisayollar a { color: var(--metin); }
:where(:root[data-tema="koyu"]) .kisayollar svg { color: var(--altin); }

@media (max-width: 1100px) {
    .bugun-bant { grid-template-columns: 1fr; }
    .kisayollar { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 640px) {
    .kisayollar,
    .bugun-bant.yalniz-kisayol .kisayollar { grid-template-columns: 1fr; }
    .bugun-etiket { min-width: 0; }
    .bugun-metin { white-space: normal; }
    .bugun-liste a { flex-direction: column; gap: 2px; }
}

/* --- Rehberler ----------------------------------------------------------- */

.uyari-serit {
    margin: 18px 0 0;
    padding: 12px 16px;
    border-radius: var(--yuvarlak);
    background: #fff4d6;
    border: 1px solid #e8cf85;
    color: #5c4300;
    font-size: .94rem;
}

.rehber-iz {
    display: flex;
    gap: 8px;
    margin-bottom: 10px;
    font-size: .82rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--altin-koyu);
}

.rehber-iz a:hover { text-decoration: underline; }

.rehber-kunye strong { font-weight: 600; color: var(--metin); }

.rehber-icindekiler {
    margin: 18px 0 8px;
    padding: 14px 18px;
    border-radius: var(--yuvarlak);
    background: var(--zemin);
    border: 1px solid var(--cizgi);
    font-size: .94rem;
}

.rehber-icindekiler ol { margin: 8px 0 0; padding-left: 1.3em; }
.rehber-icindekiler li { margin: 3px 0; }
.rehber-icindekiler a { color: var(--vurgu); }
.rehber-icindekiler a:hover { text-decoration: underline; }

.rehber-icerik h2 {
    margin: 1.7em 0 .6em;
    font-size: 1.3rem;
    font-weight: 800;
    line-height: 1.3;
    scroll-margin-top: 70px;
}

.rehber-icerik h3 { margin: 1.3em 0 .5em; font-size: 1.08rem; font-weight: 700; }

.rehber-icerik ul,
.rehber-icerik ol { margin: 0 0 1.05em; padding-left: 1.4em; }

.rehber-icerik li { margin-bottom: .4em; }

.rehber-not {
    margin: 0 0 1.1em;
    padding: 12px 16px;
    border-left: 4px solid var(--altin);
    border-radius: 0 8px 8px 0;
    background: rgba(201, 168, 106, .12);
    font-weight: 500;
}

.rehber-tablo {
    margin: 0 0 1.2em;
    overflow-x: auto;
    border: 1px solid var(--cizgi);
    border-radius: 8px;
}

.rehber-tablo table {
    width: 100%;
    border-collapse: collapse;
    font-size: .94rem;
}

.rehber-tablo th,
.rehber-tablo td {
    padding: 8px 12px;
    text-align: left;
    border-bottom: 1px solid var(--cizgi);
    white-space: nowrap;
}

.rehber-tablo td:first-child { white-space: normal; }

.rehber-tablo th {
    background: var(--zemin);
    font-size: .82rem;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--metin-soluk);
}

.rehber-tablo tbody tr:last-child td { border-bottom: 0; }
.rehber-tablo .sayi { text-align: right; font-variant-numeric: tabular-nums; }

.rehber-arac { margin: 0 0 1.2em; }

.dugme-arac {
    display: inline-block;
    padding: 10px 16px;
    border-radius: 8px;
    background: var(--lacivert);
    color: #fff !important;
    font-weight: 600;
    text-decoration: none !important;
}

.dugme-arac:hover { background: var(--lacivert-acik); }

@media (prefers-color-scheme: dark) {
    :where(:root:not([data-tema="acik"])) .uyari-serit { background: #3a2f10; border-color: #6b5520; color: #f3e2b0; }
    :where(:root:not([data-tema="acik"])) .rehber-iz { color: var(--altin); }
}

:where(:root[data-tema="koyu"]) .uyari-serit { background: #3a2f10; border-color: #6b5520; color: #f3e2b0; }
:where(:root[data-tema="koyu"]) .rehber-iz { color: var(--altin); }

.arac-rehber { margin: -4px 0 14px; font-size: .92rem; }
.arac-rehber a { color: var(--vurgu); font-weight: 600; }
.arac-rehber a:hover { text-decoration: underline; }
.rehber-tablo th:not(:first-child) { text-align: right; }

/* --- Canli bolumler: Super Lig (Spor) ve Piyasalar (Ekonomi) -------------- */

/*
 * 22.10.2026, site sahibinin istegi. Kutu dili sitenin pencereleriyle ayni
 * (.pencere: kart zemini, golge, yuvarlak kose); renkler degiskenlerden,
 * koyu tema kendiliginden geliyor. Yukselis/dusus renkleri iki temada da
 * okunur olsun diye ayri tanimli.
 */
:root {
    --artis: #157a43;
    --dusus: #c23a2e;
}

@media (prefers-color-scheme: dark) {
    :root:where(:not([data-tema="acik"])) { --artis: #57d38c; --dusus: #ff8a80; }
}

:root:where([data-tema="koyu"]) { --artis: #57d38c; --dusus: #ff8a80; }

.spor-panel,
.piyasa-panel { margin: 0 0 26px; }

.canli-panel-ust {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 6px 16px;
    margin: 0 0 12px;
}

.canli-panel-ust h2 {
    margin: 0;
    font-size: 1.3rem;
    color: var(--metin);
}

.canli-not {
    margin: 8px 0 0;
    font-size: .8rem;
    color: var(--metin-soluk);
}

.canli-not a { color: var(--vurgu); }
.canli-not a:hover { text-decoration: underline; }

.tablo-kaydir { overflow-x: auto; -webkit-overflow-scrolling: touch; }

/* Super Lig */
.spor-izgara {
    display: grid;
    grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
    gap: 18px;
    align-items: start;
}

.spor-kutu {
    background: var(--kart);
    border-radius: var(--yuvarlak);
    box-shadow: var(--golge);
    padding: 14px 16px;
    min-width: 0;
}

.spor-kutu h3 {
    margin: 0 0 10px;
    font-size: .9rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--metin);
    padding-bottom: 8px;
    border-bottom: 2px solid var(--altin);
}

.spor-kutu h3 + ul + h3,
.spor-kutu ul + h3 { margin-top: 18px; }

.puan-tablosu {
    width: 100%;
    border-collapse: collapse;
    font-size: .9rem;
    font-variant-numeric: tabular-nums;
}

.puan-tablosu th,
.puan-tablosu td {
    padding: 6px 6px;
    text-align: center;
    border-bottom: 1px solid var(--cizgi);
    white-space: nowrap;
}

.puan-tablosu th {
    font-size: .76rem;
    color: var(--metin-soluk);
    font-weight: 700;
}

.puan-tablosu .takim { text-align: left; width: 100%; }
.puan-tablosu td.takim { font-weight: 600; color: var(--metin); }
.puan-tablosu .sira { color: var(--metin-soluk); width: 1%; }
.puan-tablosu .puan { font-weight: 800; color: var(--metin); }
.puan-tablosu tbody tr:last-child td { border-bottom: 0; }

/* Ilk dort (Avrupa) ve son uc (kume dusme) satiri ince bir serit. */
.puan-tablosu tbody tr:nth-child(-n+4) td.sira { box-shadow: inset 3px 0 0 var(--artis); }
.puan-tablosu tbody tr:nth-last-child(-n+3) td.sira { box-shadow: inset 3px 0 0 var(--dusus); }

.mac-listesi {
    list-style: none;
    margin: 0;
    padding: 0;
    font-size: .9rem;
}

.mac-listesi li {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    grid-template-areas: "zaman zaman zaman" "ev skor dep";
    align-items: center;
    gap: 2px 10px;
    padding: 7px 0;
    border-bottom: 1px solid var(--cizgi);
}

.mac-listesi.sonuclar li { grid-template-areas: "ev skor dep"; }
.mac-listesi li:last-child { border-bottom: 0; }

.mac-zaman { grid-area: zaman; font-size: .76rem; color: var(--metin-soluk); }
.mac-ev    { grid-area: ev; text-align: right; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mac-dep   { grid-area: dep; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.mac-skor {
    grid-area: skor;
    min-width: 52px;
    text-align: center;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    padding: 2px 8px;
    border-radius: 6px;
    background: var(--lacivert);
    color: #fff;
}

.mac-skor.oynanmadi {
    background: transparent;
    color: var(--metin-soluk);
    border: 1px solid var(--cizgi);
}

@media (max-width: 1100px) {
    .spor-izgara { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
    .puan-tablosu .genis { display: none; }
    .puan-tablosu th, .puan-tablosu td { padding: 6px 4px; }
}

/* Spor sayfalari arasi sekmeler: Puan Durumu / Fikstur / Spor Haberleri */
.spor-sekmeler {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 20px;
}

.spor-sekmeler a {
    padding: 7px 14px;
    border-radius: 999px;
    border: 1px solid var(--cizgi);
    font-size: .88rem;
    font-weight: 600;
    color: var(--metin);
    background: var(--kart);
}

.spor-sekmeler a:hover { border-color: var(--altin); }

.spor-sekmeler a.aktif {
    background: var(--lacivert);
    border-color: var(--lacivert);
    color: #fff;
}

/* Lig secici: one cikan ligler + ulke/lig secimi (API-Football) */
.lig-secici {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: 12px 20px;
    margin: 0 0 20px;
}

.lig-hizli { display: flex; flex-wrap: wrap; gap: 6px; }

.lig-hizli a {
    padding: 5px 11px;
    border-radius: 999px;
    border: 1px solid var(--cizgi);
    font-size: .82rem;
    color: var(--metin);
    background: var(--kart);
}

.lig-hizli a:hover { border-color: var(--altin); }
.lig-hizli a.aktif { border-color: var(--altin); box-shadow: inset 0 0 0 1px var(--altin); font-weight: 700; }

.lig-form { display: flex; flex-wrap: wrap; gap: 10px; }
.lig-form label { display: flex; flex-direction: column; gap: 3px; font-size: .76rem; color: var(--metin-soluk); }

.lig-form select {
    min-width: 170px;
    max-width: 100%;
    padding: 6px 8px;
    border-radius: 8px;
    border: 1px solid var(--cizgi);
    background: var(--kart);
    color: var(--metin);
    font-size: .9rem;
}

.canli-panel-ust h2 { display: flex; align-items: center; gap: 8px; }
.lig-logo { width: 28px; height: 28px; object-fit: contain; }

.puan-tablosu td.takim a { display: inline-flex; align-items: center; gap: 7px; color: inherit; }
.puan-tablosu td.takim a:hover { color: var(--vurgu); }
.puan-tablosu td.takim img { width: 18px; height: 18px; object-fit: contain; }
.soluk { color: var(--metin-soluk); font-weight: 400; }

/* Form rozetleri: G / B / M */
.form-dizi { display: inline-flex; gap: 3px; }

.form-dizi span {
    display: inline-block;
    width: 18px;
    height: 18px;
    line-height: 18px;
    border-radius: 4px;
    font-size: .68rem;
    font-weight: 800;
    text-align: center;
    color: #fff;
}

.form-g { background: var(--artis); }
.form-b { background: #8a94a6; }
.form-m { background: var(--dusus); }

/* Fikstur: tur gezgini ve tur listesi */
.tur-gezgin {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    margin: 0 0 6px;
    font-size: .88rem;
}

.tur-gezgin a { color: var(--vurgu); }
.tur-listesi { margin-top: 14px; font-size: .85rem; }
.tur-listesi summary { cursor: pointer; color: var(--vurgu); }
.tur-listesi p { display: flex; flex-wrap: wrap; gap: 6px 12px; margin: 10px 0 0; }
.tur-listesi a { color: var(--metin); }
.tur-listesi a.aktif { font-weight: 700; color: var(--vurgu); }

.mac-listesi a.mac-ev,
.mac-listesi a.mac-dep { color: var(--metin); }
.mac-listesi a.mac-ev:hover,
.mac-listesi a.mac-dep:hover { color: var(--vurgu); }
.mac-listesi a.mac-skor { color: #fff; }
.mac-listesi a.mac-skor.oynanmadi { color: var(--metin-soluk); }
.mac-listesi li.canli .mac-skor { background: var(--dusus); }

.canli-rozet {
    display: inline-block;
    padding: 0 6px;
    border-radius: 4px;
    background: var(--dusus);
    color: #fff;
    font-size: .72rem;
    font-weight: 700;
}

/* Kulup sayfasi */
.kulup-baslik { display: flex; align-items: center; gap: 14px; margin: 0 0 16px; }
.kulup-baslik img { width: 56px; height: 56px; object-fit: contain; }
.kulup-baslik h2 { margin: 0; font-size: 1.4rem; color: var(--metin); }

.kulup-ozet {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 12px;
    margin: 0 0 18px;
}

.ozet-kart { display: flex; flex-direction: column; gap: 6px; }
.ozet-kart span:first-child { font-size: .76rem; color: var(--metin-soluk); text-transform: uppercase; letter-spacing: .06em; }
.ozet-kart b { font-size: 1.35rem; color: var(--metin); }
.ozet-kart small { color: var(--metin-soluk); }

.kulup-panel > .spor-kutu,
.kulup-panel > .spor-izgara,
.mac-panel > .spor-kutu,
.mac-panel > .spor-izgara { margin-bottom: 18px; }

.analiz-tablosu th[scope="row"] { text-align: left; font-weight: 600; color: var(--metin); }

.analiz-listesi,
.golcu-listesi { list-style: none; margin: 0 0 14px; padding: 0; font-size: .9rem; }

.analiz-listesi li,
.golcu-listesi li {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 6px 0;
    border-bottom: 1px solid var(--cizgi);
}

.analiz-listesi li:last-child,
.golcu-listesi li:last-child { border-bottom: 0; }

.golcu-listesi { columns: 2 220px; column-gap: 24px; }
.golcu-listesi li { break-inside: avoid; }

.dakika-dagilimi { list-style: none; margin: 0; padding: 0; font-size: .8rem; }
.dakika-dagilimi li { display: grid; grid-template-columns: 64px 1fr; gap: 2px 8px; margin: 0 0 6px; }
.dakika-dagilimi .aralik { grid-row: span 2; align-self: center; color: var(--metin-soluk); }

.dakika-dagilimi .cubuk {
    display: block;
    min-width: 2px;
    height: 12px;
    line-height: 12px;
    border-radius: 3px;
    padding: 0 4px;
    font-size: .66rem;
    color: #fff;
}

.cubuk.atilan,
.lejant.atilan { background: var(--artis); }
.cubuk.yenilen,
.lejant.yenilen { background: var(--dusus); }
.lejant { display: inline-block; width: 10px; height: 10px; border-radius: 2px; vertical-align: middle; }

.mac-listesi li.mac-ek {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding-top: 0;
    font-size: .8rem;
    color: var(--metin-soluk);
}

.kulup-maclari li:not(.mac-ek) { border-bottom: 0; padding-bottom: 2px; }

/* Mac sayfasi */
.mac-skorbord {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    align-items: center;
    gap: 12px;
    margin-top: 10px;
}

.mac-skorbord .takim {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    text-align: center;
    font-weight: 700;
    color: var(--metin);
}

.mac-skorbord .takim img { width: 48px; height: 48px; object-fit: contain; }
.mac-skorbord .skor { display: flex; flex-direction: column; align-items: center; gap: 4px; }
.mac-skorbord .skor b { font-size: 2rem; font-variant-numeric: tabular-nums; color: var(--metin); }
.mac-skorbord .skor small { color: var(--metin-soluk); }

.olay-listesi { list-style: none; margin: 0; padding: 0; font-size: .9rem; }

.olay-listesi li {
    display: flex;
    align-items: baseline;
    gap: 8px;
    padding: 6px 0;
    border-bottom: 1px solid var(--cizgi);
}

.olay-listesi li:last-child { border-bottom: 0; }
.olay-listesi li.dep { flex-direction: row-reverse; text-align: right; }
.olay-listesi .dk { min-width: 42px; color: var(--metin-soluk); font-variant-numeric: tabular-nums; }
.olay-listesi small { color: var(--metin-soluk); }

.mac-istatistik td { width: 30%; font-weight: 700; }
.mac-istatistik th[scope="row"] { font-weight: 500; color: var(--metin-soluk); }

.spor-izgara.esit { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.kadro { margin: 0; padding-left: 22px; font-size: .9rem; line-height: 1.7; }

@media (max-width: 700px) {
    .spor-izgara.esit { grid-template-columns: 1fr; }
    .mac-skorbord .skor b { font-size: 1.5rem; }
}

/* Fikstur sayfasinda sezonun butun haftalari, hafta hafta acilir. */
.spor-tum-fikstur { margin-top: 18px; }

.spor-tum-fikstur details { border-bottom: 1px solid var(--cizgi); }
.spor-tum-fikstur details:last-child { border-bottom: 0; }

.spor-tum-fikstur summary {
    cursor: pointer;
    padding: 9px 0;
    font-weight: 600;
    color: var(--metin);
}

.spor-tum-fikstur details[open] summary { color: var(--vurgu); }
.spor-tum-fikstur .mac-listesi { margin-bottom: 8px; }

/* Piyasalar */
.piyasa-kartlar {
    /*
     * Esnek satir, izgara degil: kart sayisi bolume gore 1-6 ve satir
     * HER ZAMAN dolu olmali (site sahibinin istegi, 23.10.2026: "bosluklari
     * gostermeyelim, dolu dolu sayfalar"). Izgarada alttaki not satiri
     * butun sutunlari tuttugu icin iki kart sekizde bir genislikte kaliyordu.
     */
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin: 0 0 18px;
}

.piyasa-kart {
    flex: 1 1 220px;
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas: "ad deg" "deger deger" "kivrim kivrim";
    gap: 2px 8px;
    background: var(--kart);
    border-radius: var(--yuvarlak);
    box-shadow: var(--golge);
    padding: 12px 14px 8px;
    min-width: 0;
}

.pk-ad    { grid-area: ad; font-size: .8rem; font-weight: 700; color: var(--metin-soluk); letter-spacing: .04em; }
.pk-deger { grid-area: deger; font-size: 1.35rem; font-weight: 800; color: var(--metin); font-variant-numeric: tabular-nums; }
.piyasa-kart .pdeg { grid-area: deg; }

.pdeg { font-size: .82rem; font-weight: 700; white-space: nowrap; font-variant-numeric: tabular-nums; }
.pdeg.arti { color: var(--artis); }
.pdeg.eksi { color: var(--dusus); }
.pdeg.duz  { color: var(--metin-soluk); }

.kivrim {
    grid-area: kivrim;
    width: 100%;
    height: 40px;
    margin-top: 4px;
}

.kivrim path { fill: none; stroke: var(--vurgu); stroke-width: 1.6; }
.kivrim.arti path { stroke: var(--artis); }
.kivrim.eksi path { stroke: var(--dusus); }

.piyasa-kart-not { flex-basis: 100%; margin: 0; }

.donem-secici {
    display: flex;
    gap: 6px;
    margin: 0 0 10px;
}

.donem-secici a {
    padding: 5px 12px;
    border-radius: 999px;
    border: 1px solid var(--cizgi);
    font-size: .84rem;
    font-weight: 600;
    color: var(--metin-soluk);
}

.donem-secici a:hover { color: var(--metin); border-color: var(--metin-soluk); }

.donem-secici a[aria-current="true"] {
    background: var(--lacivert);
    border-color: var(--lacivert);
    color: #fff;
}

.piyasa-grafikler {
    display: grid;
    /* Tek grafikli bolumde (BIST, petrol) grafik satiri doldursun. */
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 520px), 1fr));
    gap: 14px;
    margin: 0 0 18px;
}

.piyasa-grafik {
    background: var(--kart);
    border-radius: var(--yuvarlak);
    box-shadow: var(--golge);
    padding: 12px 14px;
    min-width: 0;
}

.piyasa-grafik .grafik { margin: 0; }

.piyasa-sirketler {
    background: var(--kart);
    border-radius: var(--yuvarlak);
    box-shadow: var(--golge);
    padding: 14px 16px;
}

.piyasa-sirketler h3 {
    margin: 0 0 10px;
    font-size: .9rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--metin);
    padding-bottom: 8px;
    border-bottom: 2px solid var(--altin);
}

.sirket-tablosu {
    width: 100%;
    border-collapse: collapse;
    font-size: .9rem;
}

.sirket-tablosu th,
.sirket-tablosu td {
    padding: 7px 8px;
    border-bottom: 1px solid var(--cizgi);
    text-align: left;
    white-space: nowrap;
}

.sirket-tablosu th { font-size: .76rem; color: var(--metin-soluk); font-weight: 700; }
.sirket-tablosu .kod { color: var(--metin-soluk); font-weight: 600; font-size: .82rem; }
.sirket-tablosu .sayi { text-align: right; font-variant-numeric: tabular-nums; }
.sirket-tablosu tbody tr:last-child td { border-bottom: 0; }

@media (max-width: 1100px) {
    .piyasa-grafikler { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .piyasa-kartlar { gap: 8px; }
    .piyasa-kart { flex-basis: calc(50% - 4px); }
    .pk-deger { font-size: 1.1rem; }
    .sirket-tablosu .kod { display: none; }
}

/* Acilir menuden gelinen bolumler sabit menunun altinda kalmasin. */
#puan-durumu, #fikstur, [id$="-haberleri"] { scroll-margin-top: 70px; }

/* Haber videosu (YouTube/Vimeo/Dailymotion): belge iframe'i gibi
   ekran boyu degil, 16:9. */
.gomulu-icerik.video {
    min-height: 0;
    aspect-ratio: 16 / 9;
    margin: 0 0 24px;
    background: #000;
}

.gomulu-icerik.video iframe {
    height: 100%;
    min-height: 0;
    background: #000;
}

/* Ekonomi haberleri ile Piyasalar sayfasi arasindaki bag. */
.piyasa-bag { margin: 0 0 18px; font-size: .95rem; }
.piyasa-bag a { color: var(--vurgu); font-weight: 700; }
.piyasa-bag a:hover { text-decoration: underline; }
#gostergeler, #borsa, #piyasa-grafikleri { scroll-margin-top: 70px; }
.piyasa-sirketler { margin-bottom: 26px; }

/* --- Sirket sayfasi (22.10.2026) ------------------------------------------ */

.sirket-secici {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 0 0 18px;
    font-size: .9rem;
}

.sirket-secici label { font-weight: 700; }
.sirket-secici-ya { color: var(--metin-soluk); font-size: .84rem; }

.sirket-secici select,
.sirket-secici input {
    padding: 7px 10px;
    border: 1px solid var(--cizgi);
    border-radius: 6px;
    background: transparent;
    color: var(--metin);
    font: inherit;
    min-width: 0;
}

.sirket-secici select { max-width: 100%; flex: 1 1 220px; }
.sirket-secici input { width: 110px; text-transform: uppercase; }
.sirket-secici select option { color: #111; }

.sirket-secici button {
    padding: 7px 16px;
    border: 0;
    border-radius: 6px;
    background: var(--lacivert);
    color: #fff;
    font: inherit;
    font-weight: 700;
    cursor: pointer;
}

.sirket-yol { margin: 0 0 4px; font-size: .84rem; color: var(--metin-soluk); }
.sirket-yol a:hover { text-decoration: underline; }
.sirket-kodu { font-size: .55em; color: var(--metin-soluk); font-weight: 700; letter-spacing: .04em; vertical-align: middle; }

.sirket-fiyat { display: flex; flex-wrap: wrap; align-items: baseline; gap: 10px; margin: 6px 0 0; }
.sf-deger { font-size: 1.7rem; font-weight: 800; font-variant-numeric: tabular-nums; }

.sirket-bolum { margin: 0 0 26px; scroll-margin-top: 70px; }
.sirket-grafik { margin: 0 0 8px; }
.sirket-alt-baslik { margin: 22px 0 8px; font-size: 1.02rem; scroll-margin-top: 70px; }

.analiz-tablosu tbody th { text-align: left; font-weight: 600; font-size: .9rem; color: var(--metin); }
.analiz-tablosu small { color: var(--metin-soluk); font-weight: 400; }

.olcu-tablosu td.aciklama {
    white-space: normal;
    color: var(--metin-soluk);
    font-size: .82rem;
    min-width: 220px;
}

.kunye-tablosu td { white-space: normal; }
.kunye-tablosu th { width: 34%; white-space: normal; }

.pdeg { font-variant-numeric: tabular-nums; font-weight: 600; }
.pdeg.arti { color: var(--artis); }
.pdeg.eksi { color: var(--dusus); }
.pdeg.bos, .pdeg.duz { color: var(--metin-soluk); }

.temel-izgara {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.temel-kutu {
    border: 1px solid var(--cizgi);
    border-radius: 10px;
    padding: 14px;
    font-size: .9rem;
}

.temel-kutu h3 { margin: 0 0 8px; font-size: .8rem; text-transform: uppercase; letter-spacing: .04em; color: var(--metin-soluk); }
.temel-kutu p { margin: 0 0 4px; }
.temel-buyuk { font-size: 1.35rem; font-weight: 800; }
.temel-kutu .sirket-tablosu th, .temel-kutu .sirket-tablosu td { padding: 5px 4px; }

.yasal-not {
    margin: 10px 0 24px;
    padding: 12px 14px;
    border-left: 3px solid var(--vurgu);
    background: color-mix(in srgb, var(--vurgu) 6%, transparent);
    font-size: .84rem;
    line-height: 1.55;
}

.yasal-not a { color: var(--vurgu); font-weight: 600; }

.bist-bolumu { margin: 0 0 24px; }
.bist-bolumu .piyasa-grafik { margin: 0 0 12px; }
.bist-secici p { margin: 0 0 8px; font-size: .92rem; }

.sirket-tablosu td a:hover { text-decoration: underline; color: var(--vurgu); }

@media (max-width: 1100px) {
    .temel-izgara { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 600px) {
    .temel-izgara { grid-template-columns: 1fr; }
    .sirket-secici select { flex-basis: 100%; }
    .sirket-secici input { flex: 1 1 90px; }

    /* Olcu tablosu dar ekranda: ad ve deger bir satirda, aciklama altinda. */
    .olcu-tablosu, .olcu-tablosu tbody { display: block; width: 100%; }
    .olcu-tablosu th { white-space: normal; }
    .olcu-tablosu tr { display: grid; grid-template-columns: 1fr auto; border-bottom: 1px solid var(--cizgi); }
    .olcu-tablosu th, .olcu-tablosu td { border-bottom: 0; }
    .olcu-tablosu td.aciklama { grid-column: 1 / -1; min-width: 0; padding-top: 0; }
    .kunye-tablosu tr { grid-template-columns: 1fr; }
    .kunye-tablosu th { width: auto; padding-bottom: 0; }
}

/* --- Ekonomik Gundem (Ekonomi haberlerinin altinda) ve donem analizi ------ */

.ekonomik-gundem { margin-top: 36px; }

.eg-izgara {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
    gap: 12px;
}

.eg-kart {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 14px 16px;
    background: var(--kart);
    border: 1px solid var(--cizgi);
    border-radius: 10px;
    box-shadow: var(--golge);
    color: var(--metin);
    transition: border-color .14s ease, transform .14s ease;
}

.eg-kart:hover { border-color: var(--altin); transform: translateY(-1px); }
.eg-kart strong { font-size: 1.02rem; }
.eg-satir { font-size: .92rem; display: flex; flex-wrap: wrap; gap: 6px; align-items: baseline; }
.eg-not { font-size: .84rem; color: var(--metin-soluk); margin-top: auto; }

/*
 * Donem analizi: satiri dolduran kutucuklar (site sahibinin istegi,
 * 23.10.2026: "bosluklari gostermeyelim"). Onceden tablo: etiket en
 * solda, deger en sagda, arasi bos ve uzun.
 */
.piyasa-analiz { margin-top: 12px; }

.piyasa-analiz h4 {
    margin: 0 0 8px;
    font-size: .9rem;
    font-weight: 700;
}

.pa-kutular {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 0;
}

.pa-kutu {
    flex: 1 1 130px;
    padding: 8px 10px;
    border: 1px solid var(--cizgi);
    border-radius: 7px;
}

.pa-kutu dt { font-size: .74rem; color: var(--metin-soluk); }
.pa-kutu dd { margin: 2px 0 0; font-weight: 700; font-size: .95rem; font-variant-numeric: tabular-nums; }

/* --- Sirket izgarasi: 30 sirket bir arada, her kutu tiklanir ------------- */

/*
 * Sutun sayisi 60'i TAM bolen degerlerden (2, 3, 4, 5, 6, 10, 12): son
 * satir yarim kalmasin (site sahibinin istegi, 23.10.2026). auto-fill
 * 2000 piksellik ekranda 13 sutun yapiyor, son satirda 8 kutu bosluk
 * kaliyordu. Genislik kutunun kendisine gore (container query).
 */
.piyasa-sirketler { container-type: inline-size; }

.sirket-izgara {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
}

@container (min-width: 420px)  { .sirket-izgara { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@container (min-width: 560px)  { .sirket-izgara { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@container (min-width: 700px)  { .sirket-izgara { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
@container (min-width: 840px)  { .sirket-izgara { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
@container (min-width: 1300px) { .sirket-izgara { grid-template-columns: repeat(10, minmax(0, 1fr)); } }
@container (min-width: 1650px) { .sirket-izgara { grid-template-columns: repeat(12, minmax(0, 1fr)); } }

.sirket-izgara a {
    display: grid;
    grid-template-columns: 1fr auto;
    grid-template-areas: "kod deg" "fiyat fiyat" "ad ad";
    gap: 1px 6px;
    padding: 7px 9px;
    border: 1px solid var(--cizgi);
    border-radius: 7px;
    color: var(--metin);
    font-variant-numeric: tabular-nums;
    transition: border-color .12s ease, background .12s ease;
}

.sirket-izgara a:hover,
.sirket-izgara a:focus-visible { border-color: var(--altin); background: rgba(201, 168, 106, .08); }

.sirket-izgara .si-kod   { grid-area: kod; font-weight: 700; font-size: .9rem; }
.sirket-izgara .pdeg     { grid-area: deg; font-size: .76rem; align-self: center; }
.sirket-izgara .si-fiyat { grid-area: fiyat; font-size: .86rem; }
.sirket-izgara .si-ad    {
    grid-area: ad;
    font-size: .72rem;
    color: var(--metin-soluk);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Videolu haber etiketi (kart ve manset; 23.10.2026). */
.video-rozet {
    align-self: flex-start;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin-right: 6px;
    padding: 2px 9px;
    border-radius: 999px;
    background: #c62828;
    color: #fff;
    font-size: .74rem;
    font-weight: 700;
    letter-spacing: .03em;
}

/* Kaydiragin 1. slayti: son toplamanin en onemli haberi (23.10.2026). */
.son-dakika-rozet {
    align-self: flex-start;
    display: inline-flex;
    align-items: center;
    margin-right: 6px;
    padding: 3px 10px;
    border-radius: 4px;
    background: #d50000;
    color: #fff;
    font-size: .76rem;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
    animation: son-dakika-nabiz 1.6s ease-in-out infinite;
}

@keyframes son-dakika-nabiz {
    50% { opacity: .72; }
}

@media (prefers-reduced-motion: reduce) {
    .son-dakika-rozet { animation: none; }
}

.ekonomi-haberleri { margin-top: 34px; }
.ekonomi-haberleri h2 a { color: inherit; }

/* Bolum sayfasi: grafik basina bir satir, analiz kutulari tek satirda. */
.piyasa-grafikler.analizli { grid-template-columns: minmax(0, 1fr); }

/* Sirket sayfasi: getiri tablolari genis ekranda yan yana (23.10.2026). */
@media (min-width: 1100px) {
    .sirket-ikili {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        gap: 0 30px;
        align-items: start;
    }
}

/* --- Kose yazisi gorselleri (23.10.2026) ---------------------------------- */

.kose-gorsel { margin: 4px 0 22px; }

.kose-gorsel img {
    width: 100%;
    max-height: 520px;
    object-fit: cover;
    border-radius: 8px;
}

.kose-gorsel figcaption {
    margin-top: 6px;
    font-size: .8rem;
    color: var(--metin-soluk);
}

/* Liste: gorsel solda, yazi sagda. */
.kose-liste a.gorselli {
    display: grid;
    grid-template-columns: 180px minmax(0, 1fr);
    column-gap: 16px;
    align-content: start;
}

.kose-liste a.gorselli > :not(.kose-kucuk) { grid-column: 2; }

.kose-kucuk {
    grid-column: 1;
    grid-row: 1 / span 4;
    width: 100%;
    aspect-ratio: 16 / 10;
    object-fit: cover;
    border-radius: 7px;
}

@media (max-width: 560px) {
    .kose-liste a.gorselli { grid-template-columns: 104px minmax(0, 1fr); column-gap: 12px; }
}

/* --- Kose yazarlari (23.10.2026) ------------------------------------------ */

.yazar-portre { display: block; flex: none; max-width: none; border-radius: 6px; }
.yazar-portre-bag { display: block; flex: none; }
.yazar-portre.logo { background: #fff; padding: 8px; box-shadow: inset 0 0 0 1px var(--cizgi); }

/* Yan pencere: Yazarlarimiz */
.yazar-listesi { list-style: none; margin: 0; padding: 0; }
.yazar-listesi li { display: flex; gap: 12px; align-items: flex-start; padding: 11px 0; }
.yazar-listesi li + li { border-top: 1px solid var(--cizgi); }
.yazar-metin { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.yazar-listesi .yazar-ad { font-size: .8rem; font-weight: 800; letter-spacing: .02em; color: var(--altin); text-transform: uppercase; }
.yazar-listesi .yazar-yazi { font-weight: 700; line-height: 1.3; color: var(--metin); }
.yazar-listesi .yazar-yazi:hover { color: var(--vurgu); }
.yazar-tarih { font-size: .76rem; color: var(--metin-soluk); }

/* Yazi sayfasi kunyesi */
.kose-kunye { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; }
.kose-yazar { display: inline-flex; align-items: center; gap: 10px; color: inherit; }
.kose-yazar > span { display: flex; flex-direction: column; line-height: 1.25; }
.yazar-alan { font-size: .82rem; color: var(--metin-soluk); }

/* Kose yazilari listesi: yazar seridi */
.yazar-seridi {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 10px;
    margin: 0 0 26px;
}

.yazar-seridi a {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    padding: 14px 8px;
    text-align: center;
    background: var(--kart);
    border-radius: var(--yuvarlak);
    box-shadow: var(--golge);
    color: var(--metin);
}

.yazar-seridi a:hover { box-shadow: 0 0 0 2px var(--altin); }
.yazar-seridi .yazar-ad { font-weight: 700; font-size: .88rem; line-height: 1.25; }
.yazar-seridi .yazar-alan { font-size: .76rem; }

@media (max-width: 1100px) { .yazar-seridi { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 560px)  { .yazar-seridi { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* Yazar sayfasi basligi */
.yazar-basligi { display: flex; gap: 20px; align-items: center; }
.yazar-basligi h1 { margin-bottom: 2px; }
.yazar-basligi .yazar-alan { margin: 0 0 6px; font-weight: 700; color: var(--altin); }

.yazar-portre.foto { object-fit: cover; object-position: center top; }
.yazar-basligi .yazar-not { margin: 6px 0 0; font-size: .8rem; color: var(--metin-soluk); }