/* PF2 Test Portalı — tek sayfa, koyu/açık tema uyumlu */
:root {
    --zemin: #F7F6F3;
    --panel: #FFFFFF;
    --murekkep: #1A1D23;
    --murekkep-2: #565B65;
    --murekkep-3: #878C96;
    --cizgi: #E2DFD9;
    --cizgi-2: #EFEDE9;
    --vurgu: #2C3B79;
    --vurgu-yumusak: #EDF0F8;
    --onay: #1B6F4D;
    --onay-yumusak: #E6F3ED;
    --red: #A61E16;
    --red-yumusak: #FBEAE8;
    --bekle: #845400;
    --bekle-yumusak: #FAF1E3;
    --mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
    --sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --r: 8px;
}
@media (prefers-color-scheme: dark) {
    :root {
        --zemin: #14161A; --panel: #1B1E24; --murekkep: #E8E6E2; --murekkep-2: #AEB2BA; --murekkep-3: #7E828B;
        --cizgi: #2C3038; --cizgi-2: #23262C; --vurgu: #8FA1E6; --vurgu-yumusak: #1D2233;
        --onay: #56C398; --onay-yumusak: #142520; --red: #EE7E76; --red-yumusak: #281714;
        --bekle: #D5A23F; --bekle-yumusak: #241E13;
    }
}

* { box-sizing: border-box; }
body {
    margin: 0; background: var(--zemin); color: var(--murekkep);
    font-family: var(--sans); font-size: 14px; line-height: 1.55;
    -webkit-font-smoothing: antialiased;
}

/* ---------- üst bar ---------- */
.ust {
    position: sticky; top: 0; z-index: 20;
    display: flex; align-items: center; justify-content: space-between; gap: 1rem;
    padding: .7rem 1.25rem; background: var(--panel); border-bottom: 1px solid var(--cizgi);
}
.ust-sol { display: flex; align-items: center; gap: .7rem; }
.ust h1 { margin: 0; font-size: 15px; font-weight: 600; letter-spacing: -.01em; }
.ust-sag { display: flex; align-items: center; gap: .6rem; }
.rozet {
    font-family: var(--mono); font-size: 10px; font-weight: 700; letter-spacing: .1em;
    padding: .2em .5em; border-radius: 4px; background: var(--bekle-yumusak); color: var(--bekle);
}
.nokta { width: 9px; height: 9px; border-radius: 50%; background: var(--murekkep-3); }
.nokta.iyi { background: var(--onay); }
.nokta.kotu { background: var(--red); }
.kucuk { font-size: 12px; color: var(--murekkep-3); font-family: var(--mono); }

/* ---------- düzen ---------- */
.duzen {
    display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 1.25rem; padding: 1.25rem; max-width: 1600px; margin: 0 auto; align-items: start;
}
@media (max-width: 1100px) { .duzen { grid-template-columns: 1fr; } }
.sutun { display: flex; flex-direction: column; gap: .85rem; min-width: 0; }
.cikti-sutun { position: sticky; top: 4rem; }
@media (max-width: 1100px) { .cikti-sutun { position: static; } }

/* ---------- AI kutusu ---------- */
.ai-kutu {
    background: var(--panel); border: 1px solid var(--cizgi); border-radius: var(--r);
    padding: .85rem 1rem; display: flex; flex-direction: column; gap: .55rem;
}
.ai-kutu label { font-size: 12px; font-weight: 600; color: var(--murekkep-2); }
.ai-kutu textarea {
    width: 100%; resize: vertical; font-family: inherit; font-size: 13px; line-height: 1.5;
    padding: .55rem .7rem; border: 1px solid var(--cizgi); border-radius: 6px;
    background: var(--zemin); color: var(--murekkep);
}
.ai-alt { display: flex; align-items: flex-end; justify-content: space-between; gap: .75rem; flex-wrap: wrap; }
.ai-ornekler { display: flex; flex-wrap: wrap; gap: .35rem; }
.cip {
    font-size: 11px; padding: .25em .6em; border-radius: 999px; cursor: pointer;
    border: 1px solid var(--cizgi); background: var(--zemin); color: var(--murekkep-2);
    font-family: var(--mono);
}
.cip:hover { border-color: var(--vurgu); color: var(--vurgu); }
.ai-sonuc {
    margin: 0; font-size: 12px; padding: .5rem .7rem; border-radius: 6px;
    background: var(--vurgu-yumusak); color: var(--vurgu);
}
.ai-sonuc.hata { background: var(--red-yumusak); color: var(--red); }

/* ---------- düğmeler ---------- */
.btn {
    font-family: inherit; font-size: 13px; font-weight: 500; cursor: pointer;
    padding: .5rem .9rem; border-radius: 6px; border: 1px solid var(--cizgi);
    background: var(--panel); color: var(--murekkep); transition: all .12s;
}
.btn:hover { border-color: var(--vurgu); }
.btn:disabled { opacity: .55; cursor: not-allowed; }
.btn-kucuk { padding: .25rem .55rem; font-size: 12px; }
.btn-sade { background: transparent; color: var(--murekkep-2); }
.btn-acik { background: var(--vurgu-yumusak); color: var(--vurgu); border-color: var(--vurgu); }
.btn-ai { background: var(--vurgu); color: #fff; border-color: var(--vurgu); }
.btn-gonder {
    background: var(--vurgu); color: #fff; border-color: var(--vurgu);
    font-size: 15px; font-weight: 600; padding: .75rem 1rem; width: 100%;
}
.btn-gonder:hover { filter: brightness(1.08); }
.arac-cubugu { display: flex; gap: .5rem; }

/* ---------- form ---------- */
#form { display: flex; flex-direction: column; gap: .6rem; }
.grup { background: var(--panel); border: 1px solid var(--cizgi); border-radius: var(--r); overflow: hidden; }
.grup-bas {
    display: flex; align-items: center; gap: .55rem; width: 100%; text-align: left;
    padding: .65rem .9rem; background: transparent; border: 0; cursor: pointer;
    font-family: inherit; font-size: 13px; font-weight: 600; color: var(--murekkep);
}
.grup-bas:hover { background: var(--cizgi-2); }
.grup-ikon { color: var(--murekkep-3); font-size: 11px; }
.grup-sayi { margin-left: auto; font-family: var(--mono); font-size: 11px; color: var(--murekkep-3); }
.grup-ok { color: var(--murekkep-3); transition: transform .15s; }
.grup[data-acik="1"] .grup-ok { transform: rotate(90deg); }
.grup-govde { padding: 0 .9rem .85rem; display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: .7rem; }
.grup[data-acik="0"] .grup-govde { display: none; }

.alan { display: flex; flex-direction: column; gap: .2rem; min-width: 0; }
.alan > label { font-size: 12px; color: var(--murekkep-2); font-weight: 500; }
.alan input[type="text"], .alan input[type="number"], .alan select {
    font-family: inherit; font-size: 13px; padding: .4rem .55rem;
    border: 1px solid var(--cizgi); border-radius: 6px;
    background: var(--zemin); color: var(--murekkep); width: 100%;
}
.alan input:focus, .alan select:focus { outline: 2px solid var(--vurgu); outline-offset: -1px; }
.alan .ipucu { font-size: 11px; color: var(--murekkep-3); line-height: 1.35; }
/* Onay kutusu + etiket aynı satırda; ipucu alt satıra tam genişlik iner.
   flex-wrap olmadan flex-basis:100% işe yaramaz ve etiket ezilir. */
.alan.bool { flex-flow: row wrap; align-items: center; gap: .1rem .5rem; padding-top: 1.1rem; }
.alan.bool input { flex: none; margin: 0; }
.alan.bool label { order: 2; flex: 1 1 auto; min-width: 0; }
.alan.bool .ipucu { flex: 1 0 100%; order: 3; }
.alan.degisti input, .alan.degisti select { border-color: var(--vurgu); background: var(--vurgu-yumusak); }

/* ---------- çıktı panelleri ---------- */
.panel { background: var(--panel); border: 1px solid var(--cizgi); border-radius: var(--r); overflow: hidden; }
.panel-ust {
    display: flex; align-items: center; justify-content: space-between; gap: .75rem;
    padding: .6rem .9rem; border-bottom: 1px solid var(--cizgi-2);
}
.panel-ust h2 { margin: 0; font-size: 13px; font-weight: 600; }
.panel-aksiyon { display: flex; align-items: center; gap: .5rem; }
.kod {
    margin: 0; padding: .85rem 1rem; max-height: 46vh; overflow: auto;
    font-family: var(--mono); font-size: 12px; line-height: 1.6;
    color: var(--murekkep-2); white-space: pre; tab-size: 2;
}
/* Raporlar JSON-string olarak gider → tek satır çok uzun. Varsayılan sarmalı açık. */
.kod.sar { white-space: pre-wrap; overflow-wrap: anywhere; }

/* ---------- bayat yanıt ---------- */
.bayat-uyari { display: none; }
#yanitPanel.eski { border-color: var(--bekle); }
#yanitPanel.eski .bayat-uyari {
    display: block; margin: 0; padding: .5rem .9rem; font-size: 12px;
    background: var(--bekle-yumusak); color: var(--bekle); border-bottom: 1px solid var(--cizgi-2);
}
#yanitPanel.eski .karar-serit, #yanitPanel.eski .kural-liste, #yanitPanel.eski .kod { opacity: .5; }

/* ---------- karar şeridi ---------- */
.karar-serit {
    display: flex; align-items: center; gap: .75rem; flex-wrap: wrap;
    padding: .75rem .9rem; border-bottom: 1px solid var(--cizgi-2);
}
.karar-etiket {
    font-family: var(--mono); font-size: 12px; font-weight: 700; letter-spacing: .04em;
    padding: .3em .7em; border-radius: 5px;
}
.karar-etiket.onay { background: var(--onay-yumusak); color: var(--onay); }
.karar-etiket.red { background: var(--red-yumusak); color: var(--red); }
.karar-etiket.bekle { background: var(--bekle-yumusak); color: var(--bekle); }
.karar-tutar { font-size: 17px; font-weight: 600; font-variant-numeric: tabular-nums; }
.karar-meta { font-size: 12px; color: var(--murekkep-3); }

/* ---------- kural listesi ---------- */
.kural-liste { max-height: 30vh; overflow: auto; border-bottom: 1px solid var(--cizgi-2); }
.kural {
    display: grid; grid-template-columns: 1.3rem minmax(0, 1fr) minmax(0, 1.1fr);
    gap: .5rem; padding: .3rem .9rem; font-size: 12px; align-items: baseline;
}
.kural:nth-child(odd) { background: var(--cizgi-2); }
.kural-im { font-weight: 700; }
.kural.gecti .kural-im { color: var(--onay); }
.kural.kaldi .kural-im { color: var(--red); }
.kural.kaldi { background: var(--red-yumusak); }
.kural-ad { font-weight: 500; }
.kural-detay { color: var(--murekkep-3); font-family: var(--mono); font-size: 11px; }