/* pentest-rapor konsolu — tek monospace yazı tipi, 1px düz kenarlık, yuvarlatma/gölge/gradyan yok.
   Renk yalnız anlam taşır: vurgu (odak/seçim/olumlu), şiddet renkleri, hata/uyarı. */
:root {
  --zemin: #0b0b0b; --zemin-2: #121212; --zemin-3: #1b1b1b; --cizgi: #2c2c2c;
  --metin: #d4d4d4; --soluk: #8a8a8a; --ters: #0b0b0b;
  --vurgu: #78d66b;                                   /* fosfor yeşili: odak, imleç, olumlu */
  --s-K: #ff6b6b; --s-Y: #ff9b4a; --s-O: #e6c84f; --s-D: #6aaeff; --s-B: #8a8a8a;
  --hata: #ff6b6b; --uyari: #e6c84f;
  --mono: ui-monospace, "SFMono-Regular", "Cascadia Mono", "JetBrains Mono", "DejaVu Sans Mono", Menlo, Consolas, "Liberation Mono", monospace;
}
* { box-sizing: border-box; border-radius: 0; }
[hidden] { display: none !important; }
html, body { margin: 0; height: 100%; background: var(--zemin); color: var(--metin); }
body { font: 13px/1.38 var(--mono); }
button, input, select, textarea { font: inherit; color: inherit; }
a { color: var(--metin); }
kbd { font: inherit; color: var(--vurgu); }
.soluk { color: var(--soluk); }
.sag { text-align: right; }
:focus-visible { outline: 1px solid var(--vurgu); outline-offset: -1px; }

/* --- iskelet ---------------------------------------------------------------------------- */
.konsol { height: 100vh; height: 100dvh; display: flex; flex-direction: column; overflow: hidden; }
.konsol > * { flex: none; }
.konsol > .izgara { flex: 1 1 auto; }
.durum-cubugu { display: flex; align-items: stretch; background: var(--zemin-3); border-bottom: 1px solid var(--cizgi); white-space: nowrap; overflow-x: auto; scrollbar-width: none; min-width: 0; }
.durum-cubugu::-webkit-scrollbar { display: none; }
.dc-ad { margin: 0; font: inherit; font-weight: 700; padding: 2px 10px; background: var(--metin); color: var(--ters); }
.dc-oge { padding: 2px 10px; border-left: 1px solid var(--cizgi); flex: none; }
.dc-proje { flex: 0 1 auto; min-width: 12ch; max-width: 40ch; overflow: hidden; text-overflow: ellipsis; }
.dc-dugme { background: none; border: 0; border-left: 1px solid var(--cizgi); cursor: pointer; }
.dc-dugme:hover { background: var(--zemin-2); }
.dc-dugme.sorun { color: var(--hata); }
.dc-dugme.temiz { color: var(--vurgu); }
#dc-taslak { margin-left: auto; }
.uyari-serit { margin: 0; padding: 1px 10px; border-bottom: 1px solid var(--cizgi); color: var(--soluk); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.uyari-serit b { color: var(--uyari); font-weight: 700; }
.mobil-sekme { display: none; }

.izgara { display: grid; grid-template-columns: minmax(330px, 30%) minmax(0, 1fr) 372px; min-height: 0; }
.izgara[data-onizleme="1"] { grid-template-columns: minmax(330px, 30%) minmax(0, 1fr); }
.izgara[data-onizleme="1"] #bolme-orta, .izgara[data-onizleme="1"] #bolme-cvss { display: none; }
.bolme { display: flex; flex-direction: column; min-height: 0; min-width: 0; border-right: 1px solid var(--cizgi); }
.bolme:last-child { border-right: 0; }
.bolme.odakta > .bolme-baslik { background: var(--metin); color: var(--ters); }
.bolme.odakta > .bolme-baslik .soluk { color: #3a3a3a; }
.bolme-baslik button { color: var(--metin); }
.bolme-baslik button[aria-pressed="true"] { color: var(--ters); }
.bolme.odakta > .bolme-baslik button[aria-pressed="true"] { background: var(--ters); color: var(--metin); border-color: var(--ters); }
.bolme-baslik { display: flex; gap: 10px; align-items: center; padding: 1px 8px; background: var(--zemin-3); border-bottom: 1px solid var(--cizgi); white-space: nowrap; min-height: 21px; }
.bolme-baslik > button { margin-left: auto; }
.bolme-alt { padding: 1px 8px; border-top: 1px solid var(--cizgi); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kaydir { overflow: auto; min-height: 0; flex: 1 1 auto; }
.bolme > :not(.kaydir):not(iframe) { flex: none; }
.suzgec { color: var(--uyari); }

button { background: var(--zemin-2); border: 1px solid var(--cizgi); padding: 0 6px; cursor: pointer; line-height: 1.38; }
button:hover { border-color: var(--soluk); }
button[aria-pressed="true"], button[aria-selected="true"], button[aria-checked="true"] { background: var(--metin); color: var(--ters); border-color: var(--metin); }
button[aria-selected="true"] kbd, button[aria-pressed="true"] kbd { color: var(--ters); }
input, select, textarea { background: var(--zemin-2); border: 1px solid var(--cizgi); padding: 0 4px; min-width: 0; width: 100%; }
textarea { resize: vertical; line-height: 1.38; display: block; }
input:focus, select:focus, textarea:focus { outline: 1px solid var(--vurgu); outline-offset: -1px; border-color: var(--vurgu); }
input[type="checkbox"] { width: auto; accent-color: var(--vurgu); margin: 0 4px 0 0; vertical-align: -2px; }
::placeholder { color: #6f6f6f; }

/* --- bulgu listesi ---------------------------------------------------------------------- */
.liste-sutun, .bulgu-liste li { display: grid; grid-template-columns: 7ch 3ch 4.5ch 1.5ch minmax(0, 1fr) 6ch; gap: 0 1ch; padding: 0 8px; }
.liste-sutun { color: var(--soluk); border-bottom: 1px solid var(--cizgi); }
.bulgu-liste { list-style: none; margin: 0; padding: 0; }
.bulgu-liste li { cursor: pointer; white-space: nowrap; border-left: 2px solid transparent; }
.bulgu-liste li > span { overflow: hidden; text-overflow: ellipsis; }
.bulgu-liste li:hover { background: var(--zemin-2); }
.bulgu-liste li[aria-selected="true"] { background: var(--zemin-3); border-left-color: var(--vurgu); }
.bulgu-liste:focus { outline: 0; }
.bulgu-liste:focus li[aria-selected="true"] { background: var(--metin); color: var(--ters); }
.bulgu-liste:focus li[aria-selected="true"] > span { color: var(--ters) !important; }
.bulgu-liste .kapali { color: var(--soluk); }
.bulgu-liste .bos { display: block; color: var(--soluk); padding: 4px 8px; cursor: default; }
.s-Critical { color: var(--s-K); } .s-High { color: var(--s-Y); } .s-Medium { color: var(--s-O); } .s-Low { color: var(--s-D); } .s-None { color: var(--s-B); }
.dogrulanmadi-isaret { color: var(--uyari); }

/* --- düzenleyici ------------------------------------------------------------------------ */
.sekme-satiri { display: flex; gap: 0; border-bottom: 1px solid var(--cizgi); background: var(--zemin-3); overflow-x: auto; scrollbar-width: none; }
.sekme-satiri button { border: 0; border-right: 1px solid var(--cizgi); padding: 1px 10px; background: none; white-space: nowrap; }
.sekme-satiri button[aria-selected="true"] { background: var(--metin); color: var(--ters); }
.sekme-govde { padding: 6px 8px 16px; }
.alanlar { display: block; margin: 0; }
.alan { display: grid; grid-template-columns: 15ch minmax(0, 1fr); gap: 0 1ch; align-items: start; margin: 0 0 2px; }
.anahtar { color: var(--soluk); white-space: nowrap; overflow: hidden; padding-top: 1px; }
.anahtar::after { content: ":"; }
.anahtar:empty::after { content: ""; }
.anahtar.zorunlu { color: var(--uyari); }
.deger { min-width: 0; padding-top: 1px; overflow-wrap: anywhere; }
.secenekler { display: inline-flex; flex-wrap: wrap; gap: 0; }
.secenekler button + button { border-left: 0; }
.iyi { color: var(--vurgu); }
.hata-metin, .uyari-metin { color: var(--hata); }
.uyari-metin { color: var(--uyari); }
.bos-ileti { color: var(--soluk); margin: 4px 0; }
.not-satiri { margin: 10px 0 0; }
.onay { cursor: pointer; }
.gorsel-liste { margin: 0 0 4px; padding: 0; list-style: none; }
.gorsel-liste li { display: grid; grid-template-columns: 7ch 64px minmax(0, 1fr) auto; gap: 1ch; align-items: start; padding: 2px 0; border-bottom: 1px dashed var(--cizgi); }
.gorsel-liste img { width: 64px; height: 40px; object-fit: cover; border: 1px solid var(--cizgi); display: block; background: #fff; }
.gorsel-liste .bilgi { min-width: 0; }
.birak { border: 1px dashed var(--soluk); padding: 3px 6px; color: var(--soluk); cursor: pointer; }
.birak.ustunde { border-color: var(--vurgu); color: var(--vurgu); }
.ek-oge { border-left: 1px solid var(--cizgi); padding: 2px 0 4px 6px; margin-bottom: 4px; }
.ek-oge > * + * { margin-top: 2px; }
.satir-arac { margin-bottom: 6px; }
.env-tablo { border-collapse: collapse; width: 100%; }
.env-tablo th, .env-tablo td { text-align: left; padding: 0 1ch 0 0; white-space: nowrap; border-bottom: 1px solid var(--zemin-3); }
.env-tablo th { color: var(--soluk); font-weight: 400; border-bottom-color: var(--cizgi); }
.env-tablo td.sag, .env-tablo th.sag { text-align: right; }

/* --- CVSS bölmesi ----------------------------------------------------------------------- */
.cvss-ozet { padding: 4px 8px; border-bottom: 1px solid var(--cizgi); }
.ozet-satir { display: grid; grid-template-columns: 7ch minmax(0, 1fr); gap: 0 1ch; align-items: baseline; }
.ozet-satir > :nth-child(3) { grid-column: 2; }
.anahtar-k { color: var(--soluk); }
.puan { font-weight: 700; }
#cvss-siddet { font-weight: 700; }
#cvss-ek { overflow-wrap: anywhere; }
#cvss-vektor.gecersiz { border-color: var(--hata); }
.cvss-metrikler { padding: 2px 0 8px; }
.cvss-metrikler:focus { outline: 0; }
.m-grup { display: block; width: 100%; text-align: left; border: 0; background: none; color: var(--soluk); padding: 3px 8px 0; }
.m-grup:hover { color: var(--metin); }
.m-satir { display: grid; grid-template-columns: 1.5ch 4.5ch minmax(0, auto) minmax(0, 1fr); gap: 0 0.5ch; padding: 0 8px; align-items: baseline; white-space: nowrap; }
.m-satir .imlec { color: var(--vurgu); }
.m-satir .kod { color: var(--soluk); }
.m-satir.aktif { background: var(--zemin-3); }
.m-satir.aktif .kod { color: var(--metin); }
.m-satir .degerler { display: flex; }
.m-satir .degerler button { border: 0; background: none; padding: 0 0.5ch; min-width: 3ch; }
.m-satir .degerler button:hover { background: var(--zemin-3); }
.m-satir .degerler button[aria-pressed="true"] { background: var(--metin); color: var(--ters); }
.m-satir .etiket { color: var(--soluk); overflow: hidden; text-overflow: ellipsis; padding-left: 1ch; }
.cvss-ipucu { border-top: 1px solid var(--cizgi); padding: 2px 8px; color: var(--soluk); min-height: 2.8em; overflow-wrap: anywhere; }

/* --- önizleme: beyaz kâğıt -------------------------------------------------------------- */
.onizleme { background: #3a3a3a; }
#onizleme { flex: 1 1 auto; width: 100%; border: 0; background: #fff; display: block; min-height: 0; }

/* --- alt: tuş çubuğu, günlük, komut satırı ---------------------------------------------- */
.tus-cubugu { display: flex; align-items: center; border-top: 1px solid var(--cizgi); background: var(--zemin-3); white-space: nowrap; overflow-x: auto; scrollbar-width: thin; min-width: 0; }
.tus-cubugu button { border: 0; border-right: 1px solid var(--cizgi); background: none; padding: 1px 6px; }
.tus-cubugu button:hover { background: var(--zemin-2); }
.tus-cubugu button kbd { margin-right: 0; }
.tus-cubugu .kunye { margin-left: auto; padding: 0 10px; color: var(--soluk); }
.tus-cubugu .kunye a { color: var(--soluk); }
.komut-alani { border-top: 1px solid var(--cizgi); }
.gunluk { padding: 1px 8px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--soluk); min-height: 1.38em; }
.gunluk.ok #gunluk-metin { color: var(--vurgu); }
.gunluk.hata #gunluk-metin { color: var(--hata); }
.gunluk.uyari #gunluk-metin { color: var(--uyari); }
.gunluk button { padding: 0 4px; }
.komut-satiri { display: flex; align-items: center; margin: 0; background: var(--zemin-2); border-top: 1px solid var(--cizgi); }
.kip { padding: 1px 8px; background: var(--zemin-3); color: var(--soluk); border-right: 1px solid var(--cizgi); min-width: 10ch; }
.kip.cvss { color: var(--vurgu); }
.istem { padding: 0 0 0 8px; color: var(--vurgu); }
#komut { border: 0; background: none; padding: 1px 6px 1px 2px; caret-color: var(--vurgu); }
#komut:focus { outline: 0; }
@keyframes yanip-son { 50% { opacity: 0; } }
#komut:not(:focus):placeholder-shown { caret-color: transparent; }
.istem::after { content: "▌"; color: var(--vurgu); margin-left: 1px; animation: yanip-son 1.1s steps(1) infinite; }
.komut-satiri:focus-within .istem::after { content: ""; }

/* --- katman (yardım, şablon seçici, denetim) -------------------------------------------- */
.katman { position: fixed; inset: 0; background: rgba(0, 0, 0, .72); display: flex; align-items: flex-start; justify-content: center; padding: 6vh 12px 12px; z-index: 10; }
.katman-kutu { background: var(--zemin); border: 1px solid var(--soluk); width: min(920px, 100%); max-height: 84vh; display: flex; flex-direction: column; min-height: 0; }
#katman-suz { border: 0; border-bottom: 1px solid var(--cizgi); padding: 2px 8px; }
.katman-govde { padding: 4px 0; }
.katman-govde table { border-collapse: collapse; }
.katman-govde td, .katman-govde th { padding: 0 8px; text-align: left; vertical-align: top; }
.katman-govde th { color: var(--soluk); font-weight: 400; padding-top: 6px; }
.katman-govde td:first-child { white-space: nowrap; color: var(--vurgu); }
.secim-liste { list-style: none; margin: 0; padding: 0; }
.secim-liste li { padding: 0 8px; cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.secim-liste li[aria-selected="true"] { background: var(--metin); color: var(--ters); }
.secim-liste li[aria-selected="true"] span { color: var(--ters) !important; }
.secim-liste li:hover { background: var(--zemin-3); }

@media (prefers-reduced-motion: reduce) {
  .istem::after { animation: none; }
}

/* --- mobil (≤ 760 px): tek sütun, üstte sekmeler, komut satırı altta sabit ------------- */
@media (max-width: 760px) {
  .uyari-serit { white-space: normal; }
  .uyari-serit .uzun, #dc-pencere, #dc-kapsam { display: none; }
  .mobil-sekme { display: flex; border-bottom: 1px solid var(--cizgi); }
  .mobil-sekme button { flex: 1; border: 0; border-right: 1px solid var(--cizgi); padding: 3px 0; background: var(--zemin-2); }
  .mobil-sekme button[aria-selected="true"] { background: var(--metin); color: var(--ters); }
  .izgara, .izgara[data-onizleme="1"] { grid-template-columns: minmax(0, 1fr); }
  .izgara > .bolme { display: none; border-right: 0; }
  .izgara[data-mobil="liste"] > #bolme-liste, .izgara[data-mobil="orta"] > #bolme-orta,
  .izgara[data-mobil="cvss"] > #bolme-cvss, .izgara[data-mobil="onizleme"] > #bolme-onizleme { display: flex !important; }
  .alan { grid-template-columns: 12ch minmax(0, 1fr); }
  .liste-sutun, .bulgu-liste li { grid-template-columns: 6ch 3ch 4.5ch 1.5ch minmax(0, 1fr) 5ch; }
  .tus-cubugu .kunye { display: none; }
  .dc-proje { max-width: 14ch; }
  .gorsel-liste li { grid-template-columns: 6ch 48px minmax(0, 1fr); }
  .gorsel-liste li > button { grid-column: 3; justify-self: start; }
}
