/**
 * Canlı Finans Platformu - Bileşenler CSS (Modern Dark Finance Terminal)
 */

/* ==========================================================================
   1. CANLI BANT (TICKER)
   ========================================================================== */
.canli-bant-kapsayici, .ticker-kapsayici {
    background: #04060a;
    border-bottom: 1px solid var(--kenarlik);
    overflow: hidden;
    white-space: nowrap;
    position: sticky;
    top: 0;
    z-index: 100;
    height: 36px;
    display: flex;
    align-items: center;
}

.canli-bant-kayan, .ticker-icerik {
    display: inline-flex;
    align-items: center;
    animation: tickerKaydir 40s linear infinite;
    padding: 0 10px;
}

.canli-bant-kayan:hover, .ticker-icerik:hover {
    animation-play-state: paused;
}

.bant-oge, .ticker-item {
    margin-right: 32px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--metin-ikincil);
    font-size: 12px;
    font-weight: 500;
}

.bant-oge strong {
    color: var(--metin-ana);
}

.bant-oge span[data-satis], .bant-oge span[data-fiyat] {
    font-family: 'JetBrains Mono', monospace;
    font-weight: 700;
    color: var(--altin-parlak);
}

@keyframes tickerKaydir {
    0% { transform: translate3d(0, 0, 0); }
    100% { transform: translate3d(-50%, 0, 0); }
}

/* ==========================================================================
   2. ÜST BAŞLIK (HEADER & NAV)
   ========================================================================== */
.ana-baslik {
    background: var(--yuzey-ana);
    border-bottom: 1px solid var(--kenarlik);
    position: sticky;
    top: 36px;
    z-index: 90;
    transition: background-color 0.25s ease, border-color 0.25s ease;
}

.baslik-icerik, .baslik-hizalama {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 68px;
}

.logo-alani {
    display: flex;
    align-items: center;
    gap: 8px;
    text-decoration: none;
}

.logo-baslik {
    font-size: 19px;
    font-weight: 900;
    color: var(--metin-vurgu);
    letter-spacing: -0.5px;
}

.ana-menu {
    display: flex;
    align-items: center;
    gap: 4px;
}

/* MENÜ VE AÇILIR ALT MENÜLER (DROPDOWNS) */
.nav-item-dropdown {
    position: relative;
    display: inline-block;
}

.menu-link, .nav-link {
    font-size: 13px;
    font-weight: 600;
    color: var(--metin-ikincil);
    padding: 8px 12px;
    border-radius: var(--yari-cap-sm);
    transition: all 0.2s ease;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    cursor: pointer;
    background: none;
    border: none;
    font-family: inherit;
}

.menu-link:hover, .menu-link.aktif, .nav-item-dropdown:hover > .menu-link {
    color: var(--metin-vurgu);
    background: var(--kart-arkaplan-hover);
}

.menu-link.vurgulu-link {
    color: var(--altin-renk);
}

.menu-ok {
    font-size: 9px;
    opacity: 0.7;
    transition: transform 0.2s ease;
}

.nav-item-dropdown:hover .menu-ok {
    transform: rotate(180deg);
}

/* AÇILIR MENÜ GÖVDESİ */
.dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 260px;
    background: var(--kart-arkaplan);
    border: 1px solid var(--kenarlik-parlak);
    border-radius: var(--yari-cap-md);
    box-shadow: var(--golge-lg);
    padding: 8px 0;
    display: none;
    z-index: 1000;
    animation: fadeInMenu 0.2s ease forwards;
}

.nav-item-dropdown:hover .dropdown-menu {
    display: block;
}

@keyframes fadeInMenu {
    from { opacity: 0; transform: translateY(6px); }
    to { opacity: 1; transform: translateY(0); }
}

.dropdown-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 9px 16px;
    font-size: 13px;
    color: var(--metin-ana);
    font-weight: 500;
    text-decoration: none;
    transition: background 0.15s ease, color 0.15s ease;
}

.dropdown-item:hover {
    background: var(--kart-arkaplan-hover);
    color: var(--altin-renk);
}

.dropdown-item-sol {
    display: flex;
    align-items: center;
    gap: 8px;
}

.dropdown-rozet {
    font-size: 10px;
    font-weight: 700;
    padding: 1px 6px;
    border-radius: 4px;
    background: var(--yuzey-ikincil);
    color: var(--metin-soluk);
}

.dropdown-bolucu {
    height: 1px;
    background: var(--kenarlik);
    margin: 6px 0;
}

.dropdown-mini-hesaplayici {
    padding: 12px 16px;
    background: var(--yuzey-ikincil);
    border-radius: var(--yari-cap-sm);
    margin: 6px 10px;
    border: 1px dashed var(--kenarlik);
}

.dropdown-mini-hesaplayici h5 {
    font-size: 11px;
    font-weight: 800;
    color: var(--altin-renk);
    text-transform: uppercase;
    margin-bottom: 8px;
    letter-spacing: 0.5px;
}

.mini-hesap-grup {
    display: flex;
    gap: 6px;
}

.mini-hesap-grup input {
    flex: 1;
    background: var(--girdi-arkaplan);
    border: 1px solid var(--girdi-kenarlik);
    color: var(--girdi-metin);
    padding: 6px 8px;
    border-radius: 4px;
    font-size: 12px;
    font-family: inherit;
    outline: none;
}

.mini-hesap-sonuc {
    font-size: 12px;
    font-weight: 700;
    color: var(--pozitif-renk);
    margin-top: 6px;
    font-family: 'JetBrains Mono', monospace;
}

.baslik-sag-aksiyonlar {
    display: flex;
    align-items: center;
    gap: 8px;
    position: relative;
}

.ikon-buton, .arac-butonu {
    background: var(--yuzey-ikincil);
    border: 1px solid var(--kenarlik);
    color: var(--metin-ana);
    padding: 7px 12px;
    border-radius: var(--yari-cap-sm);
    cursor: pointer;
    font-size: 13px;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: all 0.2s;
}

.ikon-buton:hover {
    border-color: var(--altin-renk);
    color: var(--altin-parlak);
}

.bildirim-sayac {
    background: var(--altin-renk);
    color: #000;
    font-size: 10px;
    font-weight: 800;
    padding: 1px 5px;
    border-radius: 10px;
}

.buton-yonetim {
    background: #1c2638;
    color: var(--altin-parlak);
    border: 1px solid #2d3d59;
    padding: 7px 14px;
    border-radius: var(--yari-cap-sm);
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
}

.mobil-menu-btn {
    display: none;
    background: none;
    border: none;
    color: #fff;
    font-size: 22px;
    cursor: pointer;
    padding: 4px 8px;
}

/* BİLDİRİM MERKEZİ AÇILIR KUTUSU */
.bildirim-acilir-kutu, .bildirim-acilir-pencere {
    position: absolute;
    right: 0;
    top: 52px;
    width: 320px;
    background: #101624;
    border: 1px solid var(--kenarlik-parlak);
    border-radius: var(--yari-cap-md);
    box-shadow: var(--golge-lg);
    z-index: 1000;
    padding: 16px;
}

.bildirim-kutu-baslik {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid var(--kenarlik);
    padding-bottom: 10px;
    margin-bottom: 10px;
}

.kapat-btn {
    background: none;
    border: none;
    color: var(--metin-soluk);
    cursor: pointer;
    font-size: 14px;
}

.bildirim-bos {
    font-size: 12px;
    color: var(--metin-soluk);
    padding: 12px 0;
    text-align: center;
}

/* ==========================================================================
   2.5 İNTERAKTİF PİYASA GRAFİK TERMİNALİ
   ========================================================================== */
.grafik-terminal-kutusu {
    background: #0b0f19;
    border: 1px solid var(--kenarlik);
    border-radius: var(--yari-cap-lg);
    padding: 24px;
    box-shadow: var(--golge-md);
    margin-bottom: 24px;
}

.grafik-terminal-ust {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    border-bottom: 1px solid var(--kenarlik);
    padding-bottom: 16px;
    margin-bottom: 18px;
}

.grafik-varlik-secici {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.grafik-varlik-btn {
    background: #101624;
    border: 1px solid var(--kenarlik);
    color: var(--metin-ikincil);
    padding: 8px 14px;
    border-radius: var(--yari-cap-sm);
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.2s ease;
}

.grafik-varlik-btn:hover {
    border-color: var(--altin-renk);
    color: #fff;
}

.grafik-varlik-btn.aktif {
    background: rgba(245, 158, 11, 0.15);
    border-color: var(--altin-renk);
    color: var(--altin-parlak);
}

.grafik-periyot-secici {
    display: flex;
    background: #101624;
    border: 1px solid var(--kenarlik);
    border-radius: var(--yari-cap-sm);
    padding: 3px;
    gap: 2px;
}

.grafik-periyot-btn {
    background: none;
    border: none;
    color: var(--metin-soluk);
    padding: 6px 12px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.2s;
}

.grafik-periyot-btn:hover {
    color: #fff;
}

.grafik-periyot-btn.aktif {
    background: #1e293b;
    color: var(--altin-parlak);
}

.grafik-istatistik-bari {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 20px;
    margin-bottom: 20px;
}

.grafik-varlik-adi {
    font-size: 13px;
    color: var(--metin-soluk);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-weight: 700;
    display: block;
    margin-bottom: 4px;
}

.grafik-fiyat-satiri {
    display: flex;
    align-items: baseline;
    gap: 12px;
}

.grafik-buyuk-rakam {
    font-size: 32px;
    font-weight: 900;
    color: #fff;
    font-family: 'JetBrains Mono', monospace;
    letter-spacing: -1px;
}

.grafik-istatistik-deger {
    font-size: 14px;
    font-weight: 800;
    font-family: 'JetBrains Mono', monospace;
    padding: 3px 8px;
    border-radius: 4px;
}

.grafik-istatistik-deger.artis {
    background: rgba(16, 185, 129, 0.15);
    color: var(--pozitif-renk);
}

.grafik-istatistik-deger.azalis {
    background: rgba(244, 63, 94, 0.15);
    color: var(--negatif-renk);
}

.istatistik-yan-bilgiler {
    display: flex;
    gap: 24px;
    flex-wrap: wrap;
}

.yan-bilgi-kutu span {
    display: block;
    font-size: 11px;
    color: var(--metin-soluk);
    font-weight: 600;
    margin-bottom: 3px;
}

.yan-bilgi-kutu strong {
    font-size: 14px;
    color: #e2e8f0;
    font-family: 'JetBrains Mono', monospace;
}

.yan-bilgi-kutu strong.yesil-yazi {
    color: var(--pozitif-renk);
}

.grafik-canvas-kapsayici {
    background: radial-gradient(circle at 50% 0%, rgba(16, 185, 129, 0.04), transparent 70%);
    border-radius: var(--yari-cap-md);
    padding: 10px 0;
}

/* ==========================================================================
   3. HERO PİYASA SKORU & GÜNLÜK AI BÜLTENİ
   ========================================================================== */
.hero-bolumu {
    margin-top: 24px;
}

.izgara-cift, .cift-sutun-izgara {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}

.kart {
    background: var(--kart-arkaplan);
    border: 1px solid var(--kenarlik);
    border-radius: var(--yari-cap-lg);
    padding: 22px;
    box-shadow: var(--golge-sm);
    transition: border-color 0.2s ease, transform 0.2s ease;
}

.kart:hover {
    border-color: var(--kenarlik-parlak);
}

.kart-baslik-alani {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 18px;
}

.kart-baslik-alani h2 {
    font-size: 15px;
    font-weight: 800;
    color: #fff;
    letter-spacing: -0.3px;
}

.kart-link {
    font-size: 12px;
    font-weight: 600;
    color: var(--altin-renk);
}

.kart-link:hover {
    text-decoration: underline;
}

/* Piyasa Skor Göstergesi */
.skor-gosterge-alani {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 20px;
}

.skor-buyuk-daire {
    width: 84px;
    height: 84px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(245, 158, 11, 0.15) 0%, rgba(14, 19, 31, 0.9) 100%);
    border: 2px solid var(--altin-renk);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.skor-sayi {
    font-size: 24px;
    font-weight: 900;
    color: var(--altin-parlak);
    font-family: 'JetBrains Mono', monospace;
    line-height: 1;
}

.skor-etiket {
    font-size: 10px;
    color: var(--metin-soluk);
    margin-top: 2px;
}

.skor-detay-metin h3 {
    font-size: 16px;
    font-weight: 800;
    color: var(--pozitif-renk);
    margin-bottom: 4px;
}

.skor-detay-metin p {
    font-size: 12px;
    color: var(--metin-ikincil);
    line-height: 1.5;
}

.skor-kategori-bari {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 8px;
    background: #090d16;
    padding: 10px;
    border-radius: var(--yari-cap-md);
    border: 1px solid var(--kenarlik);
}

.kategori-skor-oge {
    text-align: center;
}

.kategori-skor-oge span {
    display: block;
    font-size: 10px;
    font-weight: 700;
    color: var(--metin-soluk);
}

.kategori-skor-oge strong {
    font-size: 14px;
    font-weight: 800;
    color: var(--altin-parlak);
    font-family: 'JetBrains Mono', monospace;
}

/* AI Bülten Kartı */
.ai-bulten-govde {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.bulten-madde {
    background: #090d16;
    border: 1px solid var(--kenarlik);
    padding: 10px 14px;
    border-radius: var(--yari-cap-sm);
    font-size: 13px;
    line-height: 1.5;
    color: #e2e8f0;
}

.bulten-madde strong {
    color: #fff;
    margin-right: 4px;
}

.bulten-alt-bilgi {
    font-size: 12px;
    color: #f59e0b;
    margin-top: 4px;
}

.yasal-uyari-mini {
    margin-top: 12px;
    font-size: 11px;
    color: var(--metin-soluk);
}

/* ==========================================================================
   4. BÖLÜM KUTUSU & ALTIN İSTİHBARAT IZGARASI
   ========================================================================== */
.bolum-kutusu {
    background: var(--kart-arkaplan);
    border: 1px solid var(--kenarlik);
    border-radius: var(--yari-cap-lg);
    padding: 24px;
    margin-top: 24px;
}

.bolum-baslik-satiri {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
    flex-wrap: wrap;
    gap: 12px;
}

.bolum-baslik-satiri h2 {
    font-size: 18px;
    font-weight: 800;
    color: #fff;
    letter-spacing: -0.3px;
}

.alt-baslik {
    font-size: 13px;
    color: var(--metin-soluk);
    margin-top: 4px;
}

.korelasyon-rozet {
    background: rgba(245, 158, 11, 0.1);
    border: 1px solid rgba(245, 158, 11, 0.3);
    padding: 8px 14px;
    border-radius: var(--yari-cap-md);
    font-size: 12px;
    color: var(--altin-parlak);
}

/* Varlık Izgarası (Grid) */
.varlik-grid, .altin-grid-kartlar, .doviz-grid-kartlar {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 18px;
}

.kart.varlik-kart, .varlik-karti {
    background: #090d16;
    border: 1px solid var(--kenarlik);
    border-radius: var(--yari-cap-md);
    padding: 18px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    transition: all 0.25s ease;
    position: relative;
}

.kart.varlik-kart:hover, .varlik-karti:hover {
    border-color: var(--altin-renk);
    transform: translateY(-3px);
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
}

.varlik-ust {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 12px;
}

.varlik-baslik h3 {
    font-size: 15px;
    font-weight: 800;
    color: #fff;
    margin-bottom: 4px;
}

.favori-btn {
    background: none;
    border: none;
    color: var(--metin-soluk);
    font-size: 16px;
    cursor: pointer;
    transition: color 0.2s;
}

.favori-btn:hover, .favori-btn.aktif {
    color: var(--altin-renk);
}

.fiyat-ana {
    margin: 10px 0 14px 0;
}

.fiyat-deger {
    font-size: 24px;
    font-weight: 900;
    color: var(--altin-parlak);
    font-family: 'JetBrains Mono', monospace;
    letter-spacing: -0.5px;
}

.varlik-alt-bilgiler {
    background: #04060a;
    border: 1px solid var(--kenarlik);
    border-radius: var(--yari-cap-sm);
    padding: 10px 12px;
    margin-bottom: 14px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.bilgi-satir {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 12px;
    color: var(--metin-ikincil);
}

.bilgi-satir strong {
    font-family: 'JetBrains Mono', monospace;
    color: #fff;
}

.veri-yasi-etiket {
    font-size: 11px;
    font-weight: 700;
}

.veri-yasi-etiket.gercek_canli { color: var(--pozitif-renk); }
.veri-yasi-etiket.onbellek { color: var(--altin-renk); }

.kart-aksiyonlar {
    display: flex;
    gap: 8px;
}

.buton-alarm-hizli {
    width: 100%;
    background: #141c2e;
    border: 1px solid var(--kenarlik);
    color: var(--metin-ana);
    padding: 8px;
    border-radius: var(--yari-cap-sm);
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.2s;
}

.buton-alarm-hizli:hover {
    border-color: var(--altin-renk);
    background: #1a253c;
    color: var(--altin-parlak);
}

/* ==========================================================================
   5. TABLOLAR (SERBEST PİYASA DÖVİZ, BORSA HİSSELERİ)
   ========================================================================== */
.veri-tablosu, .finans-tablo {
    width: 100%;
    border-collapse: collapse;
    margin-top: 10px;
}

.veri-tablosu th, .finans-tablo th {
    background: #090d16;
    color: var(--metin-soluk);
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 12px 14px;
    text-align: left;
    border-bottom: 1px solid var(--kenarlik);
}

.veri-tablosu td, .finans-tablo td {
    padding: 14px;
    font-size: 13px;
    border-bottom: 1px solid var(--kenarlik);
    color: #e2e8f0;
    vertical-align: middle;
}

.veri-tablosu tbody tr:hover, .finans-tablo tbody tr:hover {
    background: rgba(255, 255, 255, 0.03);
}

.veri-tablosu td strong, .finans-tablo td strong {
    color: #fff;
}

.veri-tablosu td small, .finans-tablo td small {
    display: block;
    color: var(--metin-soluk);
    font-size: 11px;
    margin-top: 2px;
}

.artis {
    color: var(--pozitif-renk) !important;
    font-weight: 700;
}

.azalis {
    color: var(--negatif-renk) !important;
    font-weight: 700;
}

.notr {
    color: var(--notr-renk) !important;
}

/* Skor Rozeti */
.skor-rozet {
    display: inline-block;
    padding: 3px 8px;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 800;
    font-family: 'JetBrains Mono', monospace;
}

.skor-yuksek { background: rgba(16, 185, 129, 0.15); color: var(--pozitif-renk); border: 1px solid rgba(16, 185, 129, 0.3); }
.skor-orta { background: rgba(245, 158, 11, 0.15); color: var(--altin-renk); border: 1px solid rgba(245, 158, 11, 0.3); }
.skor-dusuk { background: rgba(244, 63, 94, 0.15); color: var(--negatif-renk); border: 1px solid rgba(244, 63, 94, 0.3); }

/* ==========================================================================
   6. PİYASA RADARI & EKONOMİK TAKVİM
   ========================================================================== */
.radar-akisi {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.radar-oge-kutu {
    background: #090d16;
    border: 1px solid var(--kenarlik);
    border-radius: var(--yari-cap-sm);
    padding: 12px 14px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.radar-oge-sol {
    display: flex;
    align-items: center;
    gap: 12px;
}

.onem-etiketi {
    font-size: 10px;
    font-weight: 800;
    padding: 2px 6px;
    border-radius: 4px;
    text-transform: uppercase;
}

.radar-oge-kutu.yuksek .onem-etiketi { background: rgba(244, 63, 94, 0.2); color: var(--negatif-renk); }
.radar-oge-kutu.orta .onem-etiketi { background: rgba(245, 158, 11, 0.2); color: var(--altin-renk); }
.radar-oge-kutu.dusuk .onem-etiketi { background: rgba(56, 189, 248, 0.2); color: var(--mavi-vurgu); }

.radar-oge-sol p {
    font-size: 12px;
    color: var(--metin-soluk);
    margin-top: 2px;
}

.radar-zaman {
    font-size: 11px;
    color: var(--metin-soluk);
    font-family: 'JetBrains Mono', monospace;
}

/* Ekonomik Takvim */
.takvim-listesi {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.takvim-oge {
    background: #090d16;
    border: 1px solid var(--kenarlik);
    border-radius: var(--yari-cap-sm);
    padding: 12px 14px;
    display: flex;
    align-items: center;
    gap: 16px;
}

.takvim-tarih {
    text-align: center;
    background: #141c2e;
    padding: 6px 10px;
    border-radius: 6px;
    flex-shrink: 0;
}

.takvim-tarih strong {
    display: block;
    font-size: 13px;
    color: #fff;
}

.takvim-tarih small {
    font-size: 11px;
    color: var(--altin-renk);
    font-family: 'JetBrains Mono', monospace;
}

.takvim-icerik h4 {
    font-size: 13px;
    color: #fff;
    margin-bottom: 2px;
}

.takvim-icerik p {
    font-size: 12px;
    color: var(--metin-soluk);
}

.onem-derecesi {
    font-size: 10px;
    font-weight: 800;
    padding: 1px 5px;
    border-radius: 3px;
    text-transform: uppercase;
    margin-bottom: 4px;
    display: inline-block;
}

.onem-derecesi.yuksek { background: rgba(244, 63, 94, 0.2); color: var(--negatif-renk); }
.onem-derecesi.orta { background: rgba(245, 158, 11, 0.2); color: var(--altin-renk); }
.onem-derecesi.dusuk { background: rgba(56, 189, 248, 0.2); color: var(--mavi-vurgu); }

/* ==========================================================================
   7.1 SAYFA ÜST BLOKLARI & BORSA FİLTRELERİ
   ========================================================================== */
.sayfa-ust-blok {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 30px 0 20px 0;
    flex-wrap: wrap;
    gap: 16px;
}

.sayfa-h1 {
    font-size: 24px;
    font-weight: 800;
    color: #fff;
    letter-spacing: -0.5px;
}

.sayfa-spot {
    font-size: 13px;
    color: var(--metin-ikincil);
    margin-top: 4px;
    max-width: 800px;
}

.piyasa-durum-kutu {
    background: #090d16;
    border: 1px solid var(--kenarlik);
    padding: 8px 14px;
    border-radius: var(--yari-cap-md);
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 12px;
}

.durum-etiket {
    padding: 2px 6px;
    border-radius: 4px;
    font-weight: 700;
    font-size: 10px;
    text-transform: uppercase;
}

.etiket-canli { background: rgba(16, 185, 129, 0.2); color: var(--pozitif-renk); }
.etiket-kapali { background: rgba(244, 63, 94, 0.2); color: var(--negatif-renk); }

.tarama-filtre-satiri {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 16px;
}

.filtre-buton-grup {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.filtre-btn {
    background: #090d16;
    border: 1px solid var(--kenarlik);
    color: var(--metin-ikincil);
    padding: 7px 12px;
    border-radius: var(--yari-cap-sm);
    font-size: 12px;
    font-weight: 600;
    transition: all 0.2s ease;
}

.filtre-btn:hover, .filtre-btn.aktif {
    background: #141c2e;
    border-color: var(--altin-renk);
    color: var(--altin-parlak);
}

.hisse-arama-kutusu input {
    background: #090d16;
    border: 1px solid var(--kenarlik);
    padding: 8px 14px;
    border-radius: var(--yari-cap-sm);
    color: #fff;
    font-size: 13px;
    width: 240px;
    outline: none;
    transition: border-color 0.2s;
}

.hisse-arama-kutusu input:focus {
    border-color: var(--altin-renk);
}

.tablo-alt-metin {
    font-size: 11px;
    color: var(--metin-soluk);
}

.hisse-kod-link strong {
    color: var(--altin-parlak);
    font-family: 'JetBrains Mono', monospace;
    font-size: 14px;
}

.hisse-kod-link:hover strong {
    text-decoration: underline;
}
.ana-alt-bilgi {
    background: #05070c;
    border-top: 1px solid var(--kenarlik);
    padding: 50px 0 30px 0;
    margin-top: auto;
}

.alt-bilgi-grid {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr;
    gap: 40px;
    margin-bottom: 40px;
}

.alt-bilgi-kolon h3 {
    font-size: 14px;
    font-weight: 700;
    color: #fff;
    margin-bottom: 16px;
}

.alt-bilgi-kolon ul {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.alt-bilgi-kolon ul li a {
    font-size: 13px;
    color: var(--metin-ikincil);
}

.alt-bilgi-kolon ul li a:hover {
    color: var(--altin-renk);
}

.alt-bilgi-alt {
    border-top: 1px solid var(--kenarlik);
    padding-top: 20px;
    font-size: 12px;
    color: var(--metin-soluk);
    text-align: center;
    line-height: 1.6;
}

/* ==========================================================================
   9. BLOG & MAKALE OKUMA SİSTEMİ (MAGAZINE UI)
   ========================================================================== */
.blog-grid-kartlar {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
    gap: 24px;
    margin-top: 24px;
}

.blog-kart {
    background: #0e131f;
    border: 1px solid var(--kenarlik);
    border-radius: var(--yari-cap-lg);
    padding: 24px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    transition: all 0.25s ease;
}

.blog-kart:hover {
    border-color: var(--altin-renk);
    transform: translateY(-3px);
    box-shadow: var(--golge-md);
}

.blog-kart-ust {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
}

.blog-tarih {
    font-size: 12px;
    color: var(--metin-soluk);
}

.blog-baslik {
    font-size: 18px;
    font-weight: 800;
    line-height: 1.4;
    color: #fff;
    margin-bottom: 10px;
}

.blog-baslik a:hover {
    color: var(--altin-parlak);
}

.blog-ozet {
    font-size: 13px;
    color: var(--metin-ikincil);
    line-height: 1.6;
    margin-bottom: 18px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.blog-alt-bilgi {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-top: 1px solid var(--kenarlik);
    padding-top: 14px;
}

.okuma-suresi {
    font-size: 12px;
    color: var(--metin-soluk);
}

.blog-devami-link {
    font-size: 13px;
    font-weight: 700;
    color: var(--altin-renk);
}

.blog-devami-link:hover {
    text-decoration: underline;
}

/* MAKALE DETAY SAYFASI */
.blog-okuma-alani {
    max-width: 900px;
    margin: 30px auto;
    padding: 0 20px;
}

.blog-gezinme-bari {
    margin-bottom: 20px;
}

.geri-link {
    font-size: 13px;
    font-weight: 600;
    color: var(--metin-soluk);
    transition: color 0.2s;
}

.geri-link:hover {
    color: var(--altin-renk);
}

.blog-makale-karti {
    background: #0e131f;
    border: 1px solid var(--kenarlik);
    border-radius: var(--yari-cap-lg);
    padding: 40px;
    box-shadow: var(--golge-lg);
}

.blog-ust-meta {
    margin-bottom: 25px;
    border-bottom: 1px solid var(--kenarlik);
    padding-bottom: 20px;
}

.meta-rozetler {
    display: flex;
    gap: 8px;
    margin-bottom: 14px;
}

.blog-ana-baslik {
    font-size: 28px;
    font-weight: 900;
    color: #fff;
    line-height: 1.35;
    letter-spacing: -0.5px;
    margin-bottom: 16px;
}

.blog-yazar-tarih {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    font-size: 12px;
    color: var(--metin-soluk);
}

.blog-yazar-tarih strong {
    color: var(--metin-ikincil);
}

.blog-vurgulu-ozet {
    background: rgba(245, 158, 11, 0.08);
    border-left: 4px solid var(--altin-renk);
    padding: 18px 22px;
    border-radius: 0 var(--yari-cap-sm) var(--yari-cap-sm) 0;
    margin-bottom: 30px;
}

.ozet-etiket {
    font-size: 11px;
    font-weight: 800;
    color: var(--altin-parlak);
    letter-spacing: 1px;
    margin-bottom: 6px;
}

.blog-vurgulu-ozet p {
    font-size: 14px;
    color: #e2e8f0;
    line-height: 1.6;
    margin: 0;
}

/* BLOG GÖVDE METNİ VE TİPOGRAFİ */
.blog-govde-metni {
    font-size: 15px;
    line-height: 1.8;
    color: #cbd5e1;
}

.blog-govde-metni p {
    margin-bottom: 18px;
}

.blog-govde-metni strong {
    color: #fff;
}

.blog-govde-metni h2 {
    font-size: 20px;
    font-weight: 800;
    color: #fff;
    margin: 32px 0 16px 0;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--kenarlik);
    display: flex;
    align-items: center;
    gap: 8px;
}

.blog-govde-metni h3 {
    font-size: 16px;
    font-weight: 700;
    color: var(--altin-parlak);
    margin: 20px 0 10px 0;
}

.blog-govde-metni ul, .blog-govde-metni ol {
    margin: 16px 0 24px 24px;
}

.blog-govde-metni li {
    margin-bottom: 8px;
    color: #e2e8f0;
}

.blog-govde-metni table, .blog-govde-metni .tablo {
    width: 100%;
    border-collapse: collapse;
    margin: 20px 0 28px 0;
    background: #090d16;
    border-radius: var(--yari-cap-sm);
    overflow: hidden;
    border: 1px solid var(--kenarlik);
}

.blog-govde-metni table th, .blog-govde-metni .tablo th {
    background: #141c2e;
    color: #fff;
    padding: 12px 14px;
    font-size: 13px;
    font-weight: 700;
    text-align: left;
    border-bottom: 1px solid var(--kenarlik);
}

.blog-govde-metni table td, .blog-govde-metni .tablo td {
    padding: 12px 14px;
    font-size: 13px;
    border-bottom: 1px solid var(--kenarlik);
    color: #e2e8f0;
}

.blog-govde-metni table tr:last-child td {
    border-bottom: none;
}

.sss-bolumu {
    background: #090d16;
    border: 1px solid var(--kenarlik);
    border-radius: var(--yari-cap-md);
    padding: 20px;
    margin: 20px 0;
}

.yasal-uyari {
    background: #06090f;
    border: 1px dashed var(--kenarlik);
    padding: 14px 18px;
    border-radius: var(--yari-cap-sm);
    font-size: 12px;
    color: var(--metin-soluk);
    margin-top: 30px;
}

.blog-alt-paylasim {
    margin-top: 40px;
    padding-top: 25px;
    border-top: 1px solid var(--kenarlik);
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 16px;
}

.paylasim-bilgi strong {
    font-size: 14px;
    color: var(--metin-vurgu);
    display: block;
}

.paylasim-bilgi p {
    font-size: 12px;
    color: var(--metin-soluk);
    margin: 2px 0 0 0;
}

/* ==========================================================================
   10. AYDINLIK (GÜNDÜZ) MODU KAPSAMLI KURALLARI
   ========================================================================== */
[data-tema="acik"], body.aydinlik-tema {
    background-color: #f8fafc !important;
    color: #0f172a !important;
}

[data-tema="acik"] .canli-bant-kapsayici,
body.aydinlik-tema .canli-bant-kapsayici,
[data-tema="acik"] .ticker-kapsayici {
    background: #e2e8f0 !important;
    border-bottom: 1px solid #cbd5e1 !important;
}

[data-tema="acik"] .bant-oge strong,
body.aydinlik-tema .bant-oge strong {
    color: #0f172a !important;
}

[data-tema="acik"] .bant-oge span,
body.aydinlik-tema .bant-oge span {
    color: #334155;
}

[data-tema="acik"] .ana-baslik,
body.aydinlik-tema .ana-baslik {
    background: #ffffff !important;
    border-bottom: 1px solid #e2e8f0 !important;
}

[data-tema="acik"] .logo-baslik,
body.aydinlik-tema .logo-baslik {
    color: #0f172a !important;
}

[data-tema="acik"] .menu-link,
body.aydinlik-tema .menu-link {
    color: #334155 !important;
}

[data-tema="acik"] .menu-link:hover,
body.aydinlik-tema .menu-link:hover,
[data-tema="acik"] .menu-link.aktif {
    color: #0f172a !important;
    background: #f1f5f9 !important;
}

[data-tema="acik"] .dropdown-menu,
body.aydinlik-tema .dropdown-menu {
    background: #ffffff !important;
    border: 1px solid #cbd5e1 !important;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1) !important;
}

[data-tema="acik"] .dropdown-item,
body.aydinlik-tema .dropdown-item {
    color: #1e293b !important;
}

[data-tema="acik"] .dropdown-item:hover,
body.aydinlik-tema .dropdown-item:hover {
    background: #f1f5f9 !important;
    color: #d97706 !important;
}

[data-tema="acik"] .dropdown-mini-hesaplayici,
body.aydinlik-tema .dropdown-mini-hesaplayici {
    background: #f8fafc !important;
    border: 1px dashed #cbd5e1 !important;
}

[data-tema="acik"] .kart,
[data-tema="acik"] .bolum-kutusu,
body.aydinlik-tema .kart,
body.aydinlik-tema .bolum-kutusu,
[data-tema="acik"] .blog-kart,
[data-tema="acik"] .blog-makale-karti {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04) !important;
}

[data-tema="acik"] .kart-baslik-alani h2,
[data-tema="acik"] .bolum-baslik-satiri h2,
[data-tema="acik"] .sayfa-h1,
[data-tema="acik"] .blog-baslik,
[data-tema="acik"] .blog-ana-baslik,
[data-tema="acik"] .blog-govde-metni strong,
[data-tema="acik"] .blog-govde-metni h2,
[data-tema="acik"] .takvim-icerik h4,
[data-tema="acik"] .takvim-tarih strong {
    color: #0f172a !important;
}

[data-tema="acik"] .skor-buyuk-daire,
body.aydinlik-tema .skor-buyuk-daire {
    background: radial-gradient(circle, rgba(217, 119, 6, 0.1) 0%, rgba(248, 250, 252, 0.95) 100%) !important;
    border-color: #d97706 !important;
}

[data-tema="acik"] .skor-kategori-bari,
[data-tema="acik"] .bulten-madde,
[data-tema="acik"] .radar-oge-kutu,
[data-tema="acik"] .takvim-oge,
[data-tema="acik"] .sss-bolumu {
    background: #f8fafc !important;
    border: 1px solid #e2e8f0 !important;
    color: #1e293b !important;
}

[data-tema="acik"] .bulten-madde strong {
    color: #0f172a !important;
}

[data-tema="acik"] .veri-tablosu th,
[data-tema="acik"] .finans-tablo th,
body.aydinlik-tema .veri-tablosu th,
body.aydinlik-tema .finans-tablo th {
    background: #f1f5f9 !important;
    color: #475569 !important;
    border-bottom: 2px solid #e2e8f0 !important;
}

[data-tema="acik"] .veri-tablosu td,
[data-tema="acik"] .finans-tablo td,
body.aydinlik-tema .veri-tablosu td,
body.aydinlik-tema .finans-tablo td {
    color: #1e293b !important;
    border-bottom: 1px solid #e2e8f0 !important;
}

[data-tema="acik"] .veri-tablosu td strong,
[data-tema="acik"] .finans-tablo td strong,
body.aydinlik-tema .veri-tablosu td strong,
body.aydinlik-tema .finans-tablo td strong {
    color: #0f172a !important;
}

[data-tema="acik"] .veri-tablosu tbody tr:hover,
[data-tema="acik"] .finans-tablo tbody tr:hover {
    background: #f8fafc !important;
}

[data-tema="acik"] .takvim-tarih {
    background: #e2e8f0 !important;
}

[data-tema="acik"] .blog-govde-metni {
    color: #334155 !important;
}

[data-tema="acik"] .grafik-istatistik-bari {
    background: #f8fafc !important;
    border: 1px solid #e2e8f0 !important;
}

[data-tema="acik"] .grafik-varlik-adi,
[data-tema="acik"] .grafik-buyuk-rakam {
    color: #0f172a !important;
}

[data-tema="acik"] .yan-bilgi-kutu {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
}

/* ==========================================================================
   12. EVRENSEL MODAL PENCERELERİ (ALARM & HIZLI HESAPLAYICI)
   ========================================================================== */
.modal-arkaplan {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    background: rgba(3, 5, 8, 0.82) !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
    z-index: 999999 !important;
    display: none;
    align-items: center !important;
    justify-content: center !important;
    padding: 16px !important;
    box-sizing: border-box !important;
}

.modal-kart {
    background: var(--kart-arkaplan) !important;
    border: 1px solid var(--kenarlik-parlak) !important;
    border-radius: var(--yari-cap-lg) !important;
    width: 100% !important;
    max-width: 480px !important;
    padding: 24px !important;
    box-shadow: 0 25px 60px rgba(0, 0, 0, 0.75) !important;
    position: relative !important;
    margin: auto !important;
    animation: modalGirisAnim 0.22s cubic-bezier(0.16, 1, 0.3, 1) forwards !important;
    box-sizing: border-box !important;
}

@keyframes modalGirisAnim {
    from {
        opacity: 0;
        transform: scale(0.92) translateY(16px);
    }
    to {
        opacity: 1;
        transform: scale(1) translateY(0);
    }
}

.modal-baslik {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    margin-bottom: 20px !important;
    padding-bottom: 14px !important;
    border-bottom: 1px solid var(--kenarlik) !important;
}

.modal-baslik h3 {
    font-size: 18px !important;
    font-weight: 800 !important;
    color: var(--metin-vurgu) !important;
    margin: 0 !important;
}

.modal-kapat-btn {
    background: var(--yuzey-ikincil) !important;
    border: 1px solid var(--kenarlik) !important;
    color: var(--metin-soluk) !important;
    font-size: 22px !important;
    line-height: 1 !important;
    cursor: pointer !important;
    padding: 4px 10px !important;
    border-radius: var(--yari-cap-sm) !important;
    transition: all 0.2s !important;
}

.modal-kapat-btn:hover {
    color: var(--negatif-renk) !important;
    border-color: var(--negatif-renk) !important;
    transform: scale(1.05);
}


/* ==========================================================================
   11. MOBİL RESPONSIVE VE FOOTER BOŞLUK DÜZENLEMELERİ
   ========================================================================== */
body {
    padding-bottom: 0;
}

@media (max-width: 768px) {
    body {
        padding-bottom: 64px; /* Mobil alt menü için güvenli alt boşluk */
    }

    .kapsayici {
        padding: 0 14px;
    }

    .ana-menu {
        display: none !important;
    }

    .mobil-menu-btn {
        display: block !important;
    }

    .izgara-cift,
    .cift-sutun-izgara,
    .hesaplayici-tab-izgara,
    .mevduat-simulasyon-izgara,
    .doviz-cevirici-izgara,
    .kredi-hesaplayici-izgara,
    .hesaplayici-izgara {
        grid-template-columns: 1fr !important;
        gap: 16px !important;
    }

    .varlik-grid {
        grid-template-columns: 1fr !important;
    }

    .alt-bilgi-grid {
        grid-template-columns: 1fr !important;
        gap: 24px !important;
    }

    .grafik-istatistik-bari {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 12px !important;
    }

    .istatistik-yan-bilgiler {
        width: 100% !important;
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        gap: 8px !important;
    }

    .grafik-varlik-secici,
    .grafik-periyot-secici {
        overflow-x: auto !important;
        white-space: nowrap !important;
        max-width: 100% !important;
        padding-bottom: 6px !important;
        -webkit-overflow-scrolling: touch;
    }

    .tablo-kapsayici {
        width: 100% !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch;
    }

    .finans-tablo,
    .veri-tablosu {
        min-width: 600px;
    }

    .mobil-alt-menu {
        display: flex !important;
        position: fixed !important;
        bottom: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: 56px !important;
        background: var(--yuzey-ana) !important;
        border-top: 1px solid var(--kenarlik) !important;
        z-index: 9999 !important;
        justify-content: space-around !important;
        align-items: center !important;
        box-shadow: 0 -4px 12px rgba(0, 0, 0, 0.25) !important;
    }

    .mobil-nav-item {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        gap: 2px !important;
        font-size: 10px !important;
        font-weight: 700 !important;
        color: var(--metin-soluk) !important;
        text-decoration: none !important;
    }

    .mobil-nav-item:hover,
    .mobil-nav-item.aktif {
        color: var(--altin-renk) !important;
    }
}