:root {
  --zemin: #f3f5f7;
  --kart: #ffffff;
  --cizgi: #dfe4ea;
  --metin: #1c2733;
  --soluk: #647283;
  --ana: #14507a;
  --ana-koyu: #0e3c5c;
  --kenar: #12283a;
  --kenar-metin: #c7d3de;
  --kirmizi: #b3261e;
  --yesil: #1b7a43;
  --sari: #8a6100;
  --mor: #5b3fa6;
}

* { box-sizing: border-box; }
html { font-size: 15px; }
body {
  margin: 0;
  background: var(--zemin);
  color: var(--metin);
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  line-height: 1.5;
}
a { color: var(--ana); text-decoration: none; }
a:hover { text-decoration: underline; }
h1 { font-size: 1.45rem; margin: 0; font-weight: 650; }
h2 { font-size: 1rem; margin: 0 0 .9rem; font-weight: 650; }
.soluk { color: var(--soluk); }
.kucuk { font-size: .85rem; }
.gizli { display: none !important; }
.sag { text-align: right; }

/* Yerleşim */
.duzen { display: grid; grid-template-columns: 230px minmax(0, 1fr); min-height: 100vh; }
.kenar { background: var(--kenar); color: var(--kenar-metin); display: flex; flex-direction: column; padding: 1.2rem 0; }
.marka { padding: 0 1.2rem 1.2rem; border-bottom: 1px solid rgba(255,255,255,.1); }
.marka strong { display: block; color: #fff; font-size: 1.1rem; }
.marka span { font-size: .8rem; }
.kenar nav { padding: .8rem .6rem; flex: 1; }
.kenar nav a { display: block; padding: .5rem .7rem; border-radius: 6px; color: var(--kenar-metin); }
.kenar nav a:hover { background: rgba(255,255,255,.07); text-decoration: none; }
.kenar nav a.secili { background: rgba(255,255,255,.14); color: #fff; font-weight: 600; }
.kullanici { padding: 1rem 1.2rem 0; border-top: 1px solid rgba(255,255,255,.1); font-size: .85rem; }
.kullanici strong { display: block; color: #fff; }
.kullanici form { margin-top: .6rem; }
.ana { padding: 1.6rem 2rem 3rem; min-width: 0; }
.ust { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1.2rem; flex-wrap: wrap; }
.ust h1 small { font-size: .9rem; font-weight: 400; }

body.bos { display: grid; place-items: center; min-height: 100vh; padding: 1rem; }
.orta { width: 100%; max-width: 380px; }

/* Kart */
.kart { background: var(--kart); border: 1px solid var(--cizgi); border-radius: 10px; padding: 1.2rem 1.3rem; margin-bottom: 1.1rem; }
.giris h1 { margin-bottom: .2rem; }
.giris p { margin: 0 0 1rem; }
.hata-kart { text-align: center; }
.hata-kart h1 { font-size: 3rem; color: var(--soluk); }

/* Bildirim */
.bildirim { padding: .7rem 1rem; border-radius: 8px; margin-bottom: 1rem; border: 1px solid; }
.bildirim.basari { background: #e8f5ed; border-color: #b6dcc5; color: #14532d; }
.bildirim.hata { background: #fdecea; border-color: #f3c0bb; color: #7a1a14; }
.bildirim.uyari { background: #fff6dd; border-color: #ecd693; color: #5c4200; }

/* Düğme */
.dugme {
  display: inline-block; padding: .5rem 1rem; border: 1px solid var(--ana); border-radius: 7px;
  background: var(--ana); color: #fff; font: inherit; font-weight: 600; cursor: pointer; white-space: nowrap;
}
.dugme:hover { background: var(--ana-koyu); text-decoration: none; }
.dugme.ikincil { background: #fff; color: var(--ana); border-color: var(--cizgi); }
.dugme.ikincil:hover { background: #f0f4f8; }
.dugme.kucuk { padding: .25rem .65rem; font-size: .85rem; font-weight: 500; }
.dugme.genis { width: 100%; }
:focus-visible { outline: 2px solid #3b8fd0; outline-offset: 2px; }

/* Form */
.alan { margin-bottom: .9rem; min-width: 0; }
.alan label { display: block; font-size: .85rem; font-weight: 600; margin-bottom: .25rem; }
.alan input[type=text], .alan input[type=password], .alan input[type=email], .alan input[type=tel],
.alan input[type=date], .alan input[type=number], .alan select, .alan textarea, .suzgec input, .suzgec select {
  width: 100%; padding: .48rem .6rem; border: 1px solid #c3ccd6; border-radius: 6px;
  font: inherit; background: #fff; color: var(--metin);
}
.alan textarea { resize: vertical; }
.alan.hatali input, .alan.hatali select, .alan.hatali textarea { border-color: var(--kirmizi); }
.alan small { display: block; margin-top: .2rem; font-size: .8rem; }
small.hata { color: var(--kirmizi); }
.yildiz { color: var(--kirmizi); }
.secenek { display: flex; gap: 1.4rem; }
.secenek label { font-weight: 400; font-size: 1rem; margin: 0; }
.izgara { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 1rem; }
.genis2 { grid-column: span 2; }
.genis3 { grid-column: 1 / -1; }
.eylem { display: flex; gap: .6rem; }
.suzgec { display: flex; gap: .6rem; margin-bottom: 1rem; }
.suzgec input { flex: 1; min-width: 0; }
.suzgec select { width: auto; }
.satir-form { display: flex; gap: .8rem; align-items: flex-end; flex-wrap: wrap; }
.satir-form .alan { margin-bottom: 0; min-width: 180px; }
.satir-form .alan.dar { min-width: 110px; width: 130px; }
.satir-form .alan.esnek { flex: 1; }

.izgara.iki { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.sabit { padding: .48rem 0; font-weight: 600; }
label.onay { display: flex; gap: .5rem; align-items: center; font-weight: 400; font-size: 1rem; }
.dar-kart { max-width: 460px; }
.ara-bosluk { margin-top: .9rem; }
.kullanici .sifre-bag { display: block; margin-top: .3rem; color: var(--kenar-metin); text-decoration: underline; font-size: .8rem; }

.dugme.tehlike { background: #fff; color: var(--kirmizi); border-color: #f0c4bf; }
.dugme.tehlike:hover { background: #fdecea; }
.tablo-ara, .secim-ara { width: 100%; padding: .42rem .6rem; border: 1px solid #c3ccd6; border-radius: 6px; font: inherit; margin-bottom: .6rem; }
.secim-ara { margin-bottom: .35rem; font-size: .9rem; }
.satir-duzelt { display: flex; gap: .4rem; align-items: center; }
.satir-duzelt input { flex: 1; min-width: 0; padding: .3rem .5rem; border: 1px solid transparent; border-radius: 5px; font: inherit; background: transparent; color: inherit; }
.satir-duzelt input:hover, .satir-duzelt input:focus { border-color: #c3ccd6; background: #fff; }
.satir-duzelt .dugme { visibility: hidden; }
.satir-duzelt:focus-within .dugme, .satir-duzelt:hover .dugme { visibility: visible; }
td.eylemler { white-space: nowrap; }
td.eylemler form { display: inline-block; margin-left: .3rem; }
.ayrac { border-top: 1px solid var(--cizgi); margin: 1.1rem 0 .8rem; }
.eylem form { margin: 0; }
.iki-sutun.ters { grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); }
table.sokaklar { table-layout: fixed; }
table.sokaklar th.s-sayi { width: 80px; }
table.sokaklar th.s-eylem { width: 175px; }
table.sokaklar td { padding-top: .3rem; padding-bottom: .3rem; }
.satir-duzelt input { width: 100%; }

/* Tablo */
.tablo-sar { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; }
th, td { text-align: left; padding: .55rem .6rem; border-bottom: 1px solid var(--cizgi); vertical-align: middle; }
th { font-size: .78rem; text-transform: uppercase; letter-spacing: .03em; color: var(--soluk); font-weight: 600; white-space: nowrap; }
tbody tr:last-child td { border-bottom: 0; }
tbody tr:hover { background: #f8fafc; }
tr.pasif td { color: var(--soluk); }
td form { margin: 0; }
.sayfalama { display: flex; gap: 1rem; justify-content: center; align-items: center; padding-top: 1rem; color: var(--soluk); }

/* Rozet */
.rozet { display: inline-block; padding: .1rem .55rem; border-radius: 999px; font-size: .78rem; font-weight: 600; white-space: nowrap; vertical-align: middle; }
.rozet.gri { background: #e9edf1; color: #4a5766; }
.rozet.mavi { background: #dcebf8; color: #0f4c7a; }
.rozet.sari { background: #fcefc7; color: var(--sari); }
.rozet.mor { background: #e9e2fa; color: var(--mor); }
.rozet.yesil { background: #d9f0e2; color: var(--yesil); }
.rozet.kirmizi { background: #fbdcd9; color: var(--kirmizi); }

/* Panel */
.kutular { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: .9rem; margin-bottom: 1.2rem; }
.kutu { background: var(--kart); border: 1px solid var(--cizgi); border-radius: 10px; padding: 1rem 1.1rem; color: var(--metin); }
a.kutu:hover { border-color: var(--ana); text-decoration: none; }
.kutu strong { display: block; font-size: 1.8rem; line-height: 1.1; }
.kutu span { font-size: .85rem; color: var(--soluk); }
.kutu.vurgulu { background: var(--ana); border-color: var(--ana); color: #fff; }
.kutu.vurgulu span { color: #d5e4f0; }

/* Detay */
.iki-sutun { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: 1.1rem; align-items: start; }
dl { display: grid; grid-template-columns: 170px minmax(0, 1fr); gap: .45rem 1rem; margin: 0; }
dt { color: var(--soluk); font-size: .88rem; }
dd { margin: 0; overflow-wrap: anywhere; }
.liste, .gecmis { list-style: none; margin: 0; padding: 0; }
.liste li { display: flex; justify-content: space-between; gap: .8rem; align-items: center; padding: .4rem 0; border-bottom: 1px solid var(--cizgi); }
.liste li:last-child { border-bottom: 0; }
.gecmis li { padding: .6rem 0 .6rem .9rem; border-left: 2px solid var(--cizgi); }
.gecmis p { margin: .3rem 0 .1rem; overflow-wrap: anywhere; }

@media (max-width: 900px) {
  .duzen { grid-template-columns: 1fr; }
  .kenar { padding: .8rem 0; }
  .kenar nav { display: flex; flex-wrap: wrap; gap: .2rem; }
  .ana { padding: 1rem; }
  .izgara, .izgara.iki, .iki-sutun { grid-template-columns: 1fr; }
  .genis2 { grid-column: auto; }
  dl { grid-template-columns: 1fr; gap: 0; }
  dd { margin-bottom: .5rem; }
  .suzgec { flex-wrap: wrap; }
}

/* Dosyalar ve küçük resimler */
.dosyalar { display: flex; flex-wrap: wrap; gap: .5rem; margin: .5rem 0 .2rem; }
.dosya { position: relative; margin: 0; width: 84px; height: 84px; }
.dosya a { display: block; width: 100%; height: 100%; border-radius: 7px; overflow: hidden; border: 1px solid var(--cizgi); background: #eef1f4; }
.dosya img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .15s; }
.dosya a.resim-bag:hover img { transform: scale(1.05); }
.dosya a.pdf-bag { display: flex; align-items: center; justify-content: center; text-decoration: none; }
.dosya a.pdf-bag span { font-weight: 700; color: var(--kirmizi); font-size: .85rem; }
.dosya form { position: absolute; top: -7px; right: -7px; margin: 0; }
.dosya-sil { width: 22px; height: 22px; border-radius: 50%; border: 1px solid #f0c4bf; background: #fff; color: var(--kirmizi); cursor: pointer; font-size: 15px; line-height: 1; padding: 0; }
.dosya-sil:hover { background: #fdecea; }

.belge-satir { padding: .9rem 0; border-bottom: 1px solid var(--cizgi); scroll-margin-top: 1rem; }
.belge-satir:first-child { padding-top: 0; }
.belge-bas { display: flex; justify-content: space-between; gap: 1rem; flex-wrap: wrap; align-items: flex-start; }
.belge-bas .rozet { margin-left: .4rem; }
.belge-durum { display: flex; gap: .4rem; align-items: center; flex-wrap: wrap; }
.belge-durum select, .belge-durum input { padding: .3rem .45rem; border: 1px solid #c3ccd6; border-radius: 6px; font: inherit; font-size: .88rem; }
.belge-durum input { width: 190px; }
.yukle-form { display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; margin-top: .4rem; }
.dosya-sec { position: relative; display: inline-flex; align-items: center; padding: .35rem .8rem; border: 1px dashed #9fb0c2; border-radius: 7px; cursor: pointer; color: var(--ana); font-size: .88rem; background: #f8fafc; }
.dosya-sec:hover { background: #eef4fa; }
.dosya-sec input { position: absolute; inset: 0; opacity: 0; cursor: pointer; width: 100%; }
.dosya-sec.buyuk { display: flex; justify-content: center; padding: 1.1rem; font-size: 1.05rem; font-weight: 600; }
.onizleme { display: flex; flex-wrap: wrap; gap: .35rem; width: 100%; }
.onizleme:empty { display: none; }
.onizleme img, .onizleme-pdf { width: 56px; height: 56px; object-fit: cover; border-radius: 6px; border: 1px solid var(--cizgi); }
.onizleme-pdf { display: inline-flex; align-items: center; justify-content: center; font-size: .75rem; font-weight: 700; color: var(--kirmizi); background: #fff; }
.eksik-liste { margin: .2rem 0 1rem; padding-left: 1.2rem; }
.dugme:disabled { opacity: .5; cursor: not-allowed; }

.kart-bas { display: flex; justify-content: space-between; align-items: center; gap: .6rem; margin-bottom: .6rem; }
.kart-bas h2 { margin: 0; }
.belge-ozet li { display: block; }
.belge-ozet-bas { display: flex; justify-content: space-between; gap: .8rem; align-items: center; }
.denetim-ozet { padding: .7rem 0; border-bottom: 1px solid var(--cizgi); }
.denetim-ozet:last-child { border-bottom: 0; padding-bottom: 0; }
.denetim-ozet:first-of-type { padding-top: 0; }
.denetim-ozet p { margin: .35rem 0; overflow-wrap: anywhere; }
.adim { border-color: #b9cfe3; background: #f7fbff; }
.adim p { margin-top: 0; }

/* Denetim */
.sekmeler { display: flex; gap: .3rem; background: #e6ebf0; padding: .2rem; border-radius: 8px; }
.sekmeler a { padding: .35rem .9rem; border-radius: 6px; color: var(--metin); }
.sekmeler a.secili { background: #fff; font-weight: 600; box-shadow: 0 1px 2px rgba(0,0,0,.08); }
.sekmeler a:hover { text-decoration: none; }
.denetim-kartlar { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: .8rem; }
.denetim-kart { display: block; color: var(--metin); margin: 0; }
.denetim-kart:hover { border-color: var(--ana); text-decoration: none; }
.denetim-kart.benim { border-left: 4px solid var(--ana); }
.dk-ust { display: flex; justify-content: space-between; gap: .5rem; align-items: flex-start; margin-bottom: .2rem; }
.denetim-cagri { display: block; color: var(--metin); border-left: 4px solid var(--mor); }
.denetim-cagri:hover { text-decoration: none; border-color: var(--mor); }
.denetim-cagri strong { font-size: 1.2rem; }
.sonuc-sec { border: 0; padding: 0; margin-left: 0; margin-right: 0; }
.sonuc-sec legend { font-size: .85rem; font-weight: 600; margin-bottom: .35rem; padding: 0; }
.sonuc-sec label { display: flex; align-items: center; gap: .5rem; padding: .55rem .7rem; border: 1px solid var(--cizgi); border-radius: 7px; margin-bottom: .4rem; cursor: pointer; }
.sonuc-sec label:has(input:checked) { border-color: var(--ana); background: #eef4fa; }
.sonuc-sec input { width: 18px; height: 18px; }
.eylem.dikey { flex-direction: column; }
.eylem.dikey .dugme { width: 100%; padding: .7rem 1rem; }

/* Büyük resim görüntüleyici */
.isik-kutu { position: fixed; inset: 0; z-index: 100; background: rgba(10, 18, 26, .92); display: none; align-items: center; justify-content: center; }
.isik-kutu.acik { display: flex; }
body.isik-acik { overflow: hidden; }
.isik-kutu figure { margin: 0; max-width: calc(100vw - 120px); max-height: calc(100vh - 40px); display: flex; flex-direction: column; align-items: center; }
.isik-kutu img { max-width: 100%; max-height: calc(100vh - 80px); object-fit: contain; border-radius: 4px; background: #222; }
.isik-kutu figcaption { color: #dfe6ec; font-size: .85rem; margin-top: .5rem; text-align: center; }
.isik-kutu button { position: absolute; background: rgba(255,255,255,.12); color: #fff; border: 0; cursor: pointer; border-radius: 50%; width: 48px; height: 48px; font-size: 30px; line-height: 1; }
.isik-kutu button:hover { background: rgba(255,255,255,.25); }
.ik-kapat { top: 14px; right: 14px; }
.ik-onceki { left: 14px; top: 50%; transform: translateY(-50%); }
.ik-sonraki { right: 14px; top: 50%; transform: translateY(-50%); }
.isik-kutu.tek .ik-onceki, .isik-kutu.tek .ik-sonraki { display: none; }

@media (max-width: 900px) {
  .isik-kutu figure { max-width: 100vw; }
  .ik-onceki, .ik-sonraki { top: auto; bottom: 14px; transform: none; }
  .belge-durum input { width: 100%; }
  .denetim-form { order: -1; }
}

.yukle-durum { width: 100%; font-size: .88rem; color: var(--ana); }
.yukle-durum:empty { display: none; }
.yukle-durum.hata { color: var(--kirmizi); }