/* HakimServer Portal — tek dosya stil. Build araci YOK (bilincli karar). */
:root {
  --bg: #0e1116; --yuzey: #171b22; --yuzey2: #1e232c; --kenar: #2a313d;
  --metin: #e6e9ef; --soluk: #9aa4b2; --vurgu: #4c9aff; --vurgu2: #2f6fd0;
  --ok: #3fb950; --warn: #d29922; --bad: #f85149; --golge: 0 1px 3px rgba(0,0,0,.4);
  --r: 12px;
}
/* Acik tema degerleri — hem otomatik (isletim sistemi) hem ELLE secimde ayni.
   Tekrar yazmamak icin tek yerde: once degiskenler, sonra iki secici. */
@media (prefers-color-scheme: light) {
  :root:not([data-tema]) {
    --bg:#f4f6fa; --yuzey:#fff; --yuzey2:#eef1f6; --kenar:#d9dee7;
    --metin:#131720; --soluk:#5d6875; --golge:0 1px 3px rgba(20,30,50,.10); }
}
:root[data-tema="acik"] {
  --bg:#f4f6fa; --yuzey:#fff; --yuzey2:#eef1f6; --kenar:#d9dee7;
  --metin:#131720; --soluk:#5d6875; --golge:0 1px 3px rgba(20,30,50,.10); }
/* Koyu secilirse :root varsayilanlari zaten koyu — ek kural gerekmiyor;
   yalnizca otomatik acik temayi ezmesi icin data-tema yeterli. */
* { box-sizing: border-box; }
body { margin:0; background:var(--bg); color:var(--metin);
  font:15px/1.5 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; }
a { color: var(--vurgu); text-decoration: none; }

/* ---------- ust bar ---------- */
header { position:sticky; top:0; z-index:10; background:var(--yuzey);
  border-bottom:1px solid var(--kenar); box-shadow:var(--golge); }
.ust { max-width:1200px; margin:0 auto; padding:.7rem 1rem;
  display:flex; align-items:center; gap:1rem; flex-wrap:wrap; }
.marka { font-weight:700; font-size:1.05rem; letter-spacing:.2px; }
.marka span { color:var(--soluk); font-weight:400; font-size:.85rem; }
nav { display:flex; gap:.3rem; margin-left:auto; flex-wrap:wrap; }
nav a { padding:.4rem .8rem; border-radius:8px; color:var(--soluk); font-weight:500; }
nav a:hover { background:var(--yuzey2); color:var(--metin); }
nav a.aktif { background:var(--vurgu); color:#fff; }

main { max-width:1200px; margin:0 auto; padding:1.2rem 1rem 3rem; }
h2 { font-size:1.05rem; margin:1.6rem 0 .7rem; color:var(--soluk);
  font-weight:600; letter-spacing:.3px; }
h2:first-child { margin-top:0; }

/* ---------- durum seridi ---------- */
.serit { display:grid; gap:.7rem; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); }
.kutu { background:var(--yuzey); border:1px solid var(--kenar); border-radius:var(--r);
  padding:.85rem 1rem; box-shadow:var(--golge); }
.kutu .etiket { font-size:.72rem; text-transform:uppercase; letter-spacing:.6px;
  color:var(--soluk); font-weight:600; }
.kutu .deger { font-size:1.5rem; font-weight:700; margin-top:.15rem; line-height:1.2; }
.kutu .alt { font-size:.78rem; color:var(--soluk); margin-top:.15rem; }
.kutu.one-cikan { border-color:var(--vurgu); }

/* olcek cubugu */
.cubuk { height:5px; background:var(--yuzey2); border-radius:99px; margin-top:.5rem; overflow:hidden; }
.cubuk i { display:block; height:100%; background:var(--ok); border-radius:99px; }
.cubuk i.warn { background:var(--warn); } .cubuk i.bad { background:var(--bad); }

/* ---------- link kartlari ---------- */
.kartlar { display:grid; gap:.7rem; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); }
.kart { display:flex; gap:.75rem; align-items:center; background:var(--yuzey);
  border:1px solid var(--kenar); border-radius:var(--r); padding:.8rem .9rem;
  box-shadow:var(--golge); transition:.12s; color:var(--metin); }
.kart:hover { border-color:var(--vurgu); transform:translateY(-1px); }
.kart .ikon { font-size:1.5rem; line-height:1; }
.kart .ad { font-weight:600; font-size:.92rem; }
.kart .acik { font-size:.75rem; color:var(--soluk); margin-top:.1rem; }

/* ---------- rozet ---------- */
.rozet { display:inline-block; padding:.13rem .5rem; border-radius:99px;
  font-size:.72rem; font-weight:700; }
.rozet.ok { background:rgba(63,185,80,.16); color:var(--ok); }
.rozet.warn { background:rgba(210,153,34,.16); color:var(--warn); }
.rozet.bad { background:rgba(248,81,73,.16); color:var(--bad); }
.nokta { width:8px; height:8px; border-radius:99px; display:inline-block; }
.nokta.ok{background:var(--ok)} .nokta.warn{background:var(--warn)} .nokta.bad{background:var(--bad)}

/* ---------- tablo ---------- */
.tablo-sar { overflow-x:auto; background:var(--yuzey); border:1px solid var(--kenar);
  border-radius:var(--r); box-shadow:var(--golge); }
table { border-collapse:collapse; width:100%; font-size:.87rem; }
th { text-align:left; padding:.6rem .8rem; color:var(--soluk); font-size:.74rem;
  text-transform:uppercase; letter-spacing:.5px; border-bottom:1px solid var(--kenar);
  white-space:nowrap; }
td { padding:.55rem .8rem; border-bottom:1px solid var(--kenar); white-space:nowrap; }
tr:last-child td { border-bottom:0; }
tr:hover td { background:var(--yuzey2); }
.mono { font-family:ui-monospace,"Cascadia Code",Consolas,monospace; font-size:.85em; }

/* ---------- form / dugme ---------- */
input[type=text],input[type=password],input[type=date],select {
  background:var(--yuzey2); border:1px solid var(--kenar); color:var(--metin);
  padding:.5rem .7rem; border-radius:8px; font-size:.9rem; width:100%; }
input:focus,select:focus { outline:2px solid var(--vurgu); outline-offset:-1px; }
.dugme { display:inline-block; background:var(--vurgu); color:#fff; border:0;
  padding:.55rem 1.1rem; border-radius:8px; font-weight:600; font-size:.9rem;
  cursor:pointer; }
.dugme:hover { background:var(--vurgu2); }
.dugme.tehlike { background:var(--bad); }
.dugme.tehlike:hover { filter:brightness(.9); }
.dugme.sessiz { background:var(--yuzey2); color:var(--metin); border:1px solid var(--kenar); }

/* ---------- giris ---------- */
.giris-sar { min-height:100vh; display:grid; place-items:center; padding:1rem; }
.giris { background:var(--yuzey); border:1px solid var(--kenar); border-radius:16px;
  padding:2rem; width:100%; max-width:370px; box-shadow:0 8px 30px rgba(0,0,0,.25); }
.giris h1 { margin:0 0 .3rem; font-size:1.3rem; }
.giris p.alt { margin:0 0 1.5rem; color:var(--soluk); font-size:.85rem; }
.alan { margin-bottom:.9rem; }
.alan label { display:block; font-size:.78rem; color:var(--soluk); margin-bottom:.3rem;
  font-weight:600; }
.uyari { background:rgba(248,81,73,.12); border:1px solid rgba(248,81,73,.35);
  color:var(--bad); padding:.6rem .8rem; border-radius:8px; font-size:.85rem;
  margin-bottom:1rem; }
.bilgi { background:rgba(76,154,255,.10); border:1px solid rgba(76,154,255,.3);
  padding:.7rem .9rem; border-radius:10px; font-size:.85rem; color:var(--soluk); }

/* ---------- tehlike bolgesi ---------- */
.tehlike-kutu { border:1px solid rgba(248,81,73,.4); background:rgba(248,81,73,.06);
  border-radius:var(--r); padding:1.1rem; }
.tehlike-kutu h3 { margin:0 0 .4rem; color:var(--bad); font-size:1rem; }
.tehlike-kutu p { margin:.3rem 0 .9rem; color:var(--soluk); font-size:.86rem; }
details summary { cursor:pointer; font-weight:600; color:var(--bad); }
.satir { display:flex; gap:.6rem; align-items:flex-end; flex-wrap:wrap; margin-top:.8rem; }
.satir > div { flex:1; min-width:150px; }
.dipnot { color:var(--soluk); font-size:.78rem; margin-top:1.5rem; text-align:center; }

/* ---------- marka gorselleri (2026-07-22) ---------- */
/* Kaynaklar portal/resources/ altinda; static/'tekiler web icin kucultuldu
   (HK_logo.png 1.8MB -> hk-logo.png 120KB · sitep1.png 8.4MB -> site.jpg 270KB).
   Buyuk dosyalari dogrudan sunmak her ziyaretcinin faturasina yazilir. */
.logo-mini { height:26px; width:auto; vertical-align:-6px; margin-right:.45rem; }
.logo { width:104px; height:auto; display:block; margin:0 auto .6rem; }

/* Giris/sakin sayfalarinda sitenin kendi fotografi arka planda.
   Uzerine koyu bir katman: metin her zaman okunur kalsin (fotograf acik
   gokyuzu iceriyor — katmansiz beyaz zeminde yazi kayboluyordu). */
body.manzara {
  min-height:100vh;
  background:
    linear-gradient(rgba(6,9,13,.78), rgba(6,9,13,.90)),
    url('/static/site.jpg') center/cover no-repeat fixed;
  color:#e6e9ef;
}
body.manzara .giris {
  background:rgba(23,27,34,.92);
  border:1px solid rgba(255,255,255,.10);
  backdrop-filter:blur(3px);
  box-shadow:0 12px 40px rgba(0,0,0,.45);
}
body.manzara .alt { color:#b9c2cf; }
/* Acik temada da ayni koyu katman kullanilir: fotograf uzerinde acik kutu
   okunakli olmuyor. Bilincli olarak tek gorunum. */
@media (prefers-color-scheme: light) {
  body.manzara { color:#e6e9ef; }
  body.manzara .giris { background:rgba(23,27,34,.92); }
  body.manzara .giris label, body.manzara .giris h1 { color:#e6e9ef; }
}
@media (max-width:560px) { body.manzara { background-attachment:scroll; } }

/* ---------- hava durumu (2026-07-22) ---------- */
.hava { display:flex; gap:.8rem; flex-wrap:wrap; align-items:center;
  background:var(--yuzey); border:1px solid var(--kenar); border-radius:var(--r);
  padding:.55rem .8rem; box-shadow:var(--golge); }
.hava-simdi { display:flex; align-items:center; gap:.7rem; padding-right:.8rem;
  border-right:1px solid var(--kenar); min-width:210px; }
.hava-ikon { font-size:2.2rem; line-height:1; }
.hava-derece { font-size:1.6rem; font-weight:700; line-height:1.15; }
.hava-gunler { display:flex; gap:.5rem; flex:1; flex-wrap:wrap; }
.hava-gun { flex:1 1 78px; text-align:center; padding:.3rem .25rem;
  background:var(--yuzey2); border-radius:8px; line-height:1.25; }
.hava-gun-ad { font-size:.8rem; font-weight:600; }
.hava-gun-ad span { display:block; font-weight:400; font-size:.65rem; color:var(--soluk); }
.hava-gun-ikon { font-size:1.25rem; line-height:1.2; }
.hava-gun-derece b { font-size:.95rem; }
.hava-gun-derece span { color:var(--soluk); font-size:.82rem; }
.hava-gun-yagis { font-size:.68rem; color:var(--soluk); }
/* Yagis ihtimali yuksekse dikkat cek — sulama/etkinlik plani icin isaret */
.hava-gun-yagis.var { color:var(--vurgu); font-weight:600; }
@media (max-width:700px) {
  .hava-simdi { border-right:0; border-bottom:1px solid var(--kenar);
    padding:0 0 .7rem; width:100%; }
}

/* ---------- kontrol kartlari ---------- */
.kutu.kritik { border-color:var(--bad); }
.kutu.dikkat { border-color:var(--warn); }

/* ---------- TELEFON (2026-07-22) ----------
   Sakinler portala telefondan girecek; masaustu once tasarlanan her ekran
   burada tekrar gozden gecirildi. Kural: yatay kaydirma OLMAYACAK, dokunma
   hedefleri kucuk olmayacak. */
@media (max-width:640px) {
  main { padding:.9rem .7rem 2.5rem; }
  .ust { padding:.55rem .7rem; gap:.5rem; }
  .marka { font-size:.95rem; width:100%; }
  .marka span { display:none; }              /* "· site beyni" dar ekranda yer kaplar */
  nav { margin-left:0; width:100%; gap:.25rem; overflow-x:auto;
        -webkit-overflow-scrolling:touch; padding-bottom:.15rem; }
  nav a { padding:.45rem .6rem; font-size:.9rem; white-space:nowrap; }
  .gorunum-form { margin-left:auto; }
  .gorunum-form input { width:4.6rem; }
  /* Ozet kutulari: telefonda 2 sutun — 1 sutun cok uzun, 4 sutun okunmaz */
  .serit { grid-template-columns:repeat(2,1fr); gap:.5rem; }
  .kutu { padding:.6rem .7rem; }
  .kutu .deger { font-size:1.25rem; }
  .kartlar { grid-template-columns:1fr; }
  h2 { font-size:.98rem; margin:1.2rem 0 .5rem; }
  /* Tablolar zaten .tablo-sar icinde yatay kayiyor; yazi biraz kuculsun */
  table { font-size:.82rem; }
  td, th { padding:.45rem .55rem; }
  .daire-izgara { grid-template-columns:repeat(auto-fill,minmax(140px,1fr)); }
  .dugme { padding:.5rem .8rem; }
}
@media (max-width:380px) {
  .serit { grid-template-columns:1fr; }      /* cok dar ekranda tek sutun */
}

/* ---------- tema dugmesi ---------- */
.tema-dugme { background:none; border:1px solid var(--kenar); border-radius:8px;
  color:var(--soluk); cursor:pointer; font-size:1rem; line-height:1;
  padding:.35rem .55rem; }
.tema-dugme:hover { border-color:var(--vurgu); color:var(--metin); }

/* Sakin sayfasindaki dar kart icinde hava kutusu — kenarliksiz, kompakt */
.hava-sar { margin-top:1rem; }
.hava-sar .hava { padding:.7rem .8rem; background:var(--yuzey2); }
.hava-sar .hava-simdi { border-right:0; border-bottom:1px solid var(--kenar);
  padding:0 0 .6rem; width:100%; min-width:0; }
.hava-sar .hava-ikon { font-size:2.2rem; }
.hava-sar .hava-derece { font-size:1.6rem; }
.hava-sar .hava-gunler { margin-top:.6rem; }
.hava-sar .hava-gun { flex:1 1 60px; padding:.35rem .2rem; }

/* ---------- daire cagri gecmisi (TEK akordiyon) ---------- */
.gecmis-kutu { background:var(--yuzey); border:1px solid var(--kenar);
  border-radius:var(--r); box-shadow:var(--golge); margin-top:1rem;
  overflow:hidden; text-align:left; }
.gecmis-kutu > summary { cursor:pointer; padding:.65rem .85rem; display:flex;
  align-items:center; justify-content:space-between; gap:.6rem;
  flex-wrap:wrap; list-style:none; }
.gecmis-kutu > summary::-webkit-details-marker { display:none; }
.gecmis-baslik { font-weight:600; font-size:.95rem; }
.gecmis-baslik::before { content:'▸'; color:var(--soluk); margin-right:.45rem;
  display:inline-block; transition:.15s; }
.gecmis-kutu[open] > summary .gecmis-baslik::before { transform:rotate(90deg); }
.gecmis-ozet { display:flex; align-items:center; gap:.4rem; font-size:.8rem; }
.gecmis-icerik { padding:0 .85rem .6rem; }
/* Gun ayraci — kucuk ve sakin; asil vurgu cagri satirinda */
.gun-baslik { font-size:.74rem; text-transform:uppercase; letter-spacing:.5px;
  color:var(--soluk); font-weight:600; margin:.7rem 0 .2rem;
  padding-top:.5rem; border-top:1px solid var(--kenar); }
.gun-baslik:first-child { border-top:0; padding-top:0; margin-top:.2rem; }
.cagri { display:flex; align-items:center; gap:.5rem; padding:.35rem 0;
  font-size:.86rem; flex-wrap:wrap; }
/* ⚠️ Metin SOLUK DEGIL: onceki surumde --soluk kullanilmisti ve
   "Gelen çağrı · Güvenlik 3" okunmuyordu (kullanici bildirdi). */
.cagri-metin { flex:1; min-width:9rem; color:var(--metin); }
.cagri-saat { color:var(--soluk); font-size:.8rem; }
.cagri-yon { font-size:.95rem; }

/* ---------- alt bilgi ---------- */
.altbilgi { max-width:1200px; margin:2.5rem auto 0; padding:1rem;
  border-top:1px solid var(--kenar); color:var(--soluk); font-size:.8rem;
  text-align:center; line-height:1.7; }
.altbilgi .ayrac { opacity:.5; margin:0 .35rem; }
body.manzara .altbilgi { border-top-color:rgba(255,255,255,.12); color:#9aa4b2; }
.giris-sar { display:flex; flex-direction:column; }

/* ---------- sakin kimlik seridi ---------- */
.daire-kimlik { display:inline-flex; align-items:center; gap:.4rem; flex-wrap:wrap;
  justify-content:center; margin:.3rem auto .1rem; padding:.3rem .8rem;
  background:var(--yuzey2); border:1px solid var(--kenar); border-radius:99px;
  font-size:.86rem; }
.dk-blok { font-weight:700; letter-spacing:.3px; }
.dk-ayrac { opacity:.45; }
.dk-no b { font-family:ui-monospace,SFMono-Regular,Menlo,monospace; }

/* ---------- sakin: kamera dugmesi ---------- */
.kamera-dugme { display:block; margin:.7rem auto .2rem; width:max-content;
  font-weight:600; }

/* ---------- KARANLIK TEMA OKUNURLUK (2026-07-22) ----------
   Manzara arka planinin uzerindeki koyu kartlarda ikincil metinler
   (--soluk) fazla sonuktu: "K2/D14", hava dereceleri, ikinci duyuru
   neredeyse okunmuyordu. Bu ekranlarda ikincil renk ACILIR. */
body.manzara .alt,
body.manzara .bilgi .alt { color:#c4ccd8; }
body.manzara .bilgi { background:rgba(76,154,255,.10);
  border:1px solid rgba(76,154,255,.25); color:#e6e9ef; }
body.manzara .uyari { color:#ffd9d5; }
body.manzara .daire-kimlik { background:rgba(255,255,255,.10);
  border-color:rgba(255,255,255,.20); color:#e6e9ef; }
body.manzara .hava { background:rgba(255,255,255,.06);
  border-color:rgba(255,255,255,.14); }
body.manzara .hava-derece,
body.manzara .hava-gun-derece b { color:#f2f5f9; }
body.manzara .hava-gun { background:rgba(255,255,255,.07); }
body.manzara .hava-gun-ad,
body.manzara .hava-gun-derece span,
body.manzara .hava-gun-yagis { color:#c4ccd8; }
body.manzara .gecmis-kutu { background:rgba(255,255,255,.06);
  border-color:rgba(255,255,255,.14); }
body.manzara .cagri-metin { color:#e6e9ef; }
body.manzara .gun-baslik { color:#c4ccd8; border-top-color:rgba(255,255,255,.12); }
