/* Marka: uygulamayla aynı (app/lib/ekranlar/ortak.dart): beyaz zemin, siyah, tek vurgu trafik sarısı, Barlow. */
@font-face { font-family: "Barlow"; src: url("../fonts/Barlow-Regular.ttf") format("truetype"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Barlow"; src: url("../fonts/Barlow-SemiBold.ttf") format("truetype"); font-weight: 600; font-display: swap; }
@font-face { font-family: "Barlow Condensed"; src: url("../fonts/BarlowCondensed-ExtraBold.ttf") format("truetype"); font-weight: 800; font-display: swap; }

:root {
    --siyah: #111111;
    --sari: #ffcc00;
    --sari-acik: #fff4c2;
    --zemin: #ffffff;
    --zemin-2: #f7f7f5;
    --kart: #ffffff;
    --yazi: #111111;
    --soluk: #6b6b68;
    --cizgi: #e4e4e0;
    --hata: #982119;
    --bilgi: #17602d;
}

* { box-sizing: border-box; }
body { margin: 0; font-family: "Barlow", "Segoe UI", system-ui, sans-serif; background: var(--zemin-2); color: var(--yazi); }
a { color: var(--siyah); text-decoration-color: var(--sari); text-decoration-thickness: 2px; text-underline-offset: 3px; }
h1 { font-family: "Barlow Condensed", "Barlow", sans-serif; font-weight: 800; font-size: 1.9rem; margin: 0 0 12px; }
h2 { font-size: 1.1rem; font-weight: 600; margin: 0 0 8px; }
h2 small { color: var(--soluk); font-weight: normal; font-size: .85rem; }

.ust { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px;
       padding: 10px 20px; background: var(--siyah); border-bottom: 4px solid var(--sari); }
.marka { display: flex; align-items: center; gap: 10px; color: #fff; text-decoration: none;
         font-family: "Barlow Condensed", "Barlow", sans-serif; font-weight: 800; font-size: 1.35rem; letter-spacing: .2px; }
.marka img { width: 30px; height: 30px; }
.marka small { color: var(--sari); font-family: "Barlow", sans-serif; font-weight: 600; font-size: .95rem; }
nav { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 18px; }
nav a, nav .baglanti { color: #fff; text-decoration: none; font-weight: 600; padding: 4px 0; border-bottom: 2px solid transparent; }
nav a:hover, nav .baglanti:hover, nav a.secili { border-bottom-color: var(--sari); color: var(--sari); }
.kapsam { padding: 7px 20px; background: var(--sari-acik); color: var(--siyah); font-weight: 600; font-size: .95rem; border-bottom: 1px solid var(--cizgi); }

main { max-width: 1600px; margin: 0 auto; padding: 20px; }
footer { text-align: center; color: var(--soluk); font-size: .8rem; padding: 16px; }

.kart { background: var(--kart); border: 1px solid var(--cizgi); border-radius: 6px; padding: 16px; margin-bottom: 16px; }
.kart.dar { max-width: 440px; margin: 40px auto; border-top: 4px solid var(--sari); }
.kartlar { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px; }
.kart.sayi { display: flex; flex-direction: column; gap: 2px; margin-bottom: 0; border-left: 4px solid var(--sari); }
.kart.sayi span { font-family: "Barlow Condensed", "Barlow", sans-serif; font-size: 2rem; font-weight: 800; overflow-wrap: anywhere; }
.kart.sayi small { color: var(--soluk); }

.filtre, .yatay { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 8px 12px; margin-bottom: 12px; }
.dikey { display: flex; flex-direction: column; gap: 10px; }
label { display: flex; flex-direction: column; gap: 4px; font-size: .9rem; color: var(--soluk); }
input, select { font: inherit; padding: 6px 8px; border: 1px solid var(--cizgi); border-radius: 4px; color: var(--yazi); background: #fff; max-width: 100%; }
input:focus, select:focus { outline: 2px solid var(--sari); outline-offset: 0; border-color: var(--siyah); }
button { font: inherit; font-weight: 600; padding: 7px 16px; border: 0; border-radius: 4px; background: var(--siyah); color: #fff; cursor: pointer; }
button:hover { background: #333; }
button.baglanti { background: none; color: var(--siyah); padding: 0; text-decoration: underline; text-decoration-color: var(--sari); }
.satir-ici { display: inline; }
/* Üst çubuktaki Çıkış: genel bağlantı-düğme kuralı siyah yazı veriyordu (siyah zeminde görünmüyordu). */
nav button.baglanti { color: #fff; text-decoration: none; }
nav button.baglanti:hover { color: var(--sari); background: none; }
.pdf-formu { margin-top: 12px; }
.pdf-formu button { background: var(--sari); color: var(--siyah); }
.pdf-formu button:hover { background: #f0c000; }

.not { color: var(--soluk); font-size: .85rem; }
.hata { color: var(--hata); }
.bilgi { color: var(--bilgi); }
.uyari { background: var(--sari-acik); padding: 10px 12px; border-radius: 4px; border-left: 4px solid var(--sari); }
.karekod { margin: 12px 0; }
.anahtar code { overflow-wrap: anywhere; }

.tablo-kap { overflow-x: auto; }
.tablo { border-collapse: collapse; width: 100%; font-size: .85rem; }
.tablo th, .tablo td { text-align: left; padding: 4px 8px; border-bottom: 1px solid var(--cizgi); }

/* DevExtreme: mavi vurgu yerine marka. */
.dx-widget { font-family: "Barlow", "Segoe UI", sans-serif; }
.dx-datagrid-headers { color: var(--siyah); font-weight: 600; }
.dx-datagrid .dx-row-focused, .dx-datagrid-rowsview .dx-selection.dx-row > td { background: var(--sari-acik) !important; color: var(--siyah) !important; }
.dx-datagrid-rowsview .dx-row:hover > td { background: var(--sari-acik); }
.dx-button.dx-button-default, .dx-datagrid-export-button { border-color: var(--siyah); }
.dx-texteditor.dx-state-focused::after, .dx-texteditor.dx-state-active::after { border-bottom-color: var(--sari) !important; }
.dx-texteditor.dx-state-focused.dx-editor-outlined { border-color: var(--siyah); }
.dx-page.dx-selection { background: var(--siyah) !important; color: #fff !important; }
.dx-loadpanel-indicator .dx-loadindicator-segment-inner, .dx-loadindicator-segment-inner { border-color: var(--sari) var(--sari) transparent var(--sari) !important; }

/* Grafik + altındaki konu listesi. Dar ekranda liste uzar, yer açılır. */
#grafik { height: 520px; }
@media (max-width: 700px) { #grafik { height: 860px; } }

@media (max-width: 480px) {
    main { padding: 12px; }
    .filtre label, .yatay label { flex: 1 1 100%; }
    .marka small { display: none; }
}

/* Harita hücre detayı. */
.popup-icerik { height: 100%; overflow-y: auto; }
.popup-icerik h3 { font-size: 1rem; margin: 12px 0 4px; }
.popup-icerik ul { margin: 0; padding-left: 18px; }