/* ------------------------------------------------------------------
   Hukuk Eğitim İçtihat — tasarım
   Renk ve yazı tipi değişkenleri mevzuat-site (aristoakademi.com) ile birebir
   aynıdır; iki site görsel olarak aynı aileden görünsün diye.
   Tailwind kullanılmıyor: tek bir CSS dosyası, derleme adımı yok, sunucuda
   yalnızca "dotnet publish" yeterli.
   ------------------------------------------------------------------ */

:root {
  --background: #fbfaf8;
  --surface: #ffffff;
  --foreground: #1c1917;
  --muted: #57534e;
  --border: #e7e5e4;
  --brand: #f5871f;          /* Hukuk Eğitim turuncusu (logo) */
  --accent: #b4560d;         /* metin için koyulaştırılmış turuncu, beyaz zeminde 4.7:1 */
  --accent-soft: #fdf0e3;
  --on-accent: #ffffff;
  --vurgu: #fde68a;

  --sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --serif: "Source Serif 4", Georgia, "Times New Roman", serif;
}

@media (prefers-color-scheme: dark) {
  :root {
    --background: #121110;
    --surface: #1c1a19;
    --foreground: #eeeae6;
    --muted: #a8a29e;
    --border: #33302d;
    --accent: #f7a04a;
    --accent-soft: #3a2614;
    --on-accent: #1c1917;
    --vurgu: #8a5a00;
  }
}

/* ---------- temel ---------- */

*, *::before, *::after { box-sizing: border-box; }

html {
  scroll-padding-top: 4.5rem; /* yapışkan üst çubuk */
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  background: var(--background);
  color: var(--foreground);
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

a { color: inherit; text-decoration: none; }
a:hover { color: var(--accent); }
h1, h2, h3 { font-family: var(--serif); font-weight: 600; line-height: 1.25; margin: 0; }

.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.atla:focus {
  position: fixed; top: .5rem; left: .5rem; z-index: 50; width: auto; height: auto;
  clip: auto; margin: 0; padding: .5rem .75rem; border-radius: .375rem;
  background: var(--accent); color: var(--on-accent);
}

mark {
  background: var(--vurgu);
  color: var(--foreground);
  border-radius: .15rem;
  padding: 0 .1rem;
}

.sayisal { font-variant-numeric: tabular-nums; }
.sessiz { color: var(--muted); }
.kucuk { font-size: .875rem; }

/* ---------- üst çubuk ---------- */

.ust-cubuk {
  position: sticky; top: 0; z-index: 30;
  background: var(--surface);
  border-bottom: 1px solid var(--border);
}
.ust-ic {
  max-width: 80rem; margin: 0 auto; padding: 0 1rem;
  height: 3.5rem; display: flex; align-items: center; gap: 1rem;
}
.logo { font-family: var(--serif); font-size: 1.125rem; font-weight: 600; flex-shrink: 0; }
.logo span { color: var(--accent); }

.ust-arama { margin-left: auto; display: flex; gap: .375rem; flex: 1 1 auto; min-width: 0; max-width: 28rem; }

/* ---------- form ögeleri ---------- */

.girdi {
  width: 100%; min-width: 0;
  padding: .375rem .625rem;
  font: inherit; font-size: .875rem;
  color: var(--foreground);
  background: var(--background);
  border: 1px solid var(--border);
  border-radius: .375rem;
  outline: none;
}
.girdi:focus { border-color: var(--accent); }
.girdi-buyuk { padding: .75rem 1rem; font-size: 1rem; background: var(--surface); }

.dugme {
  flex-shrink: 0; padding: .375rem .75rem;
  font: inherit; font-size: .875rem; font-weight: 500;
  color: var(--on-accent); background: var(--accent);
  border: 1px solid transparent; border-radius: .375rem;
  cursor: pointer;
}
.dugme:hover { opacity: .9; }
.dugme-buyuk { padding: .75rem 1.5rem; font-size: 1rem; }
.dugme-sade {
  color: var(--foreground); background: var(--surface);
  border-color: var(--border);
}
.dugme-sade:hover { border-color: var(--accent); opacity: 1; }

/* ---------- sayfa yerleşimi ---------- */

main { flex: 1 1 auto; }

.kapsa { max-width: 80rem; margin: 0 auto; padding: 2rem 1rem; }
.kapsa-dar { max-width: 56rem; margin: 0 auto; padding: 2rem 1rem; }

.iki-kolon { display: grid; gap: 1.5rem; }
@media (min-width: 1024px) {
  .iki-kolon { grid-template-columns: minmax(0, 1fr) 19rem; gap: 2rem; }
}

.kart {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: .5rem;
}
.kart-ic { padding: 1rem; }

/* ---------- ana sayfa ---------- */

.giris-baslik { font-size: 2.25rem; letter-spacing: -.02em; }
@media (min-width: 640px) { .giris-baslik { font-size: 3rem; } }
.giris-aciklama { margin-top: 1rem; max-width: 40rem; font-size: 1.125rem; color: var(--muted); }

.giris-form { margin-top: 2rem; display: flex; flex-direction: column; gap: .5rem; }
@media (min-width: 640px) { .giris-form { flex-direction: row; } }
.giris-form .girdi { flex: 1 1 auto; }

.ipucu { margin-top: .75rem; font-size: .875rem; color: var(--muted); }
code {
  font-family: ui-monospace, "Cascadia Mono", Consolas, monospace;
  font-size: .85em;
  background: var(--accent-soft); color: var(--accent);
  padding: .05rem .3rem; border-radius: .25rem;
}

.kapsam-liste { margin: 1rem 0 0; padding: 0; list-style: none; display: grid; gap: .75rem; }
@media (min-width: 640px) { .kapsam-liste { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.kapsam-liste li { padding: 1rem; background: var(--surface); border: 1px solid var(--border); border-radius: .5rem; }
.kapsam-liste .ad { font-weight: 500; }

/* ---------- süzgeç paneli ---------- */

.panel { padding: 1rem; }
@media (min-width: 1024px) {
  .panel {
    position: sticky; top: 4.5rem;
    max-height: calc(100vh - 6rem);
    overflow-y: auto;
    /* Uzun merci adları yatay kaydırma çubuğu doğurmasın; adlar zaten kısalıyor */
    overflow-x: hidden;
  }
  .panel-dar { display: none; }
}
@media (max-width: 1023px) {
  .panel-genis { display: none; }
}

.panel-bolum { margin-bottom: 1.5rem; }
.panel-bolum:last-child { margin-bottom: 0; }
.panel-baslik {
  margin: 0 0 .5rem; padding: 0;
  font-size: .75rem; font-weight: 600; text-transform: uppercase;
  letter-spacing: .05em; color: var(--muted);
}
fieldset {
  margin: 0; padding: 0; border: 0;
  /* Tarayıcıların varsayılanı min-inline-size:min-content; bu yüzden fieldset
     içindeki uzun merci adı kadar genişleyip paneli taşırıyordu (88 px ölçüldü)
     ve karar sayıları kırpılıyordu. */
  min-inline-size: 0;
  min-width: 0;
}

.secenekler { list-style: none; margin: 0; padding: 0; font-size: .875rem; }
.secenekler li + li { margin-top: .125rem; }

/* Uzun merci adı kısalır, karar sayısı her zaman görünür kalır */
.secenek {
  display: flex; align-items: baseline; gap: .35rem;
  padding: .25rem .5rem; border-radius: .25rem;
}
.secenek-ad {
  flex: 1 1 auto; min-width: 0;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.secenek-adet { flex: 0 0 auto; }
.secenek:hover { background: var(--accent-soft); color: var(--foreground); }
.secenek.secili { background: var(--accent-soft); font-weight: 500; }

/* İki yıl kutusu + düğme: kutular width:100% istediği için min-width sıfırlanmazsa taşar */
.yil-satir { display: flex; align-items: center; gap: .5rem; }
.yil-satir .girdi { flex: 1 1 0; min-width: 0; }

/* Merci grupları: Kurullar / Hukuk Daireleri / Ceza Daireleri ... */
.merci-grup + .merci-grup { margin-top: .75rem; }
.merci-grup-baslik {
  font-size: .8125rem;
  font-weight: 600;
  color: var(--foreground);
  padding: .125rem .5rem;
  margin-bottom: .125rem;
  border-bottom: 1px solid var(--border);
}
summary.merci-grup-baslik { cursor: pointer; }
summary.merci-grup-baslik::marker { color: var(--muted); }

details > summary { cursor: pointer; }
.daha {
  padding: .25rem .5rem; font-size: .875rem; color: var(--accent);
}
.daha:hover { text-decoration: underline; }
.kaydirilir { max-height: 16rem; overflow-y: auto; margin-top: .25rem; }

/* ---------- sonuç listesi ---------- */

.sonuc-ust {
  display: flex; flex-wrap: wrap; align-items: flex-end;
  justify-content: space-between; gap: .75rem; margin-bottom: 1rem;
}
.sira-liste { list-style: none; display: flex; flex-wrap: wrap; gap: .25rem; margin: 0; padding: 0; font-size: .875rem; }
.sira-dugme {
  display: block; padding: .25rem .625rem;
  border: 1px solid var(--border); border-radius: .25rem; background: var(--surface);
}
.sira-dugme:hover { border-color: var(--accent); }
.sira-dugme.secili { border-color: var(--accent); background: var(--accent-soft); font-weight: 500; }

.sonuclar { list-style: none; margin: 0; padding: 0 1rem; }
.sonuclar > li { padding: 1rem 0; border-bottom: 1px solid var(--border); }
.sonuclar > li:last-child { border-bottom: 0; }
.sonuc-kunye { font-weight: 500; line-height: 1.35; }
.sonuc-bilgi {
  margin-top: .25rem; display: flex; flex-wrap: wrap; gap: .25rem .75rem;
  font-size: .875rem; color: var(--muted);
}
.sonuc-alinti {
  margin: .5rem 0 0; font-size: .875rem; line-height: 1.65; color: var(--muted);
}

.bos-sonuc { padding: 1.5rem; color: var(--muted); }
.bos-sonuc a { color: var(--accent); text-decoration: underline; }

/* ---------- sayfalama ---------- */

.sayfalama {
  display: flex; flex-wrap: wrap; align-items: center;
  justify-content: space-between; gap: .5rem 1rem; font-size: .875rem;
}
.sayfalama.ust { margin-bottom: .75rem; }
.sayfalama.alt { margin-top: 1.5rem; }
.sayfalama ul { list-style: none; display: flex; flex-wrap: wrap; align-items: center; gap: .25rem; margin: 0; padding: 0; }
.sayfa-dugme {
  display: block; padding: .25rem .625rem;
  border: 1px solid var(--border); border-radius: .25rem; background: var(--surface);
}
.sayfa-dugme:hover { border-color: var(--accent); }
.sayfa-pasif { padding: .25rem .625rem; color: var(--muted); opacity: .6; }
.sayfa-simdi {
  display: block; padding: .25rem .625rem;
  border: 1px solid var(--accent); border-radius: .25rem;
  background: var(--accent-soft); font-weight: 500;
}

/* ---------- karar detayı ---------- */

.izlek { font-size: .875rem; color: var(--muted); margin-bottom: 1rem; }
.izlek a { color: var(--accent); }
.izlek a:hover { text-decoration: underline; }

.karar-baslik { font-size: 1.75rem; }
.kunye-tablo {
  margin: 1rem 0 0; display: grid; gap: .25rem 1rem;
  grid-template-columns: max-content 1fr; font-size: .9375rem;
}
.kunye-tablo dt { color: var(--muted); }
.kunye-tablo dd { margin: 0; }

.karar-metin {
  font-family: var(--serif);
  font-size: 1.0625rem;
  line-height: 1.85;
  /* Not: content-visibility:auto denendi, şimdilik kapalı.
     Tek bir dev kapsayıcıya (140 paragraf, 25.000 piksel) uygulamak yanlış
     ayrıntı düzeyi; mevzuat-site aynı tekniği madde başına uyguluyor.
     Paragraf başına uygulanabilir ama ölçmeden eklemiyoruz: elimizdeki
     önizleme aracı uzun sayfalarda güvenilir ölçüm vermiyor. Gerçek tarayıcıda
     ölçüp karar verilecek. */
}
.karar-metin p { margin: .9rem 0; }

.ozet-kutu {
  margin-top: 1.5rem; padding: 1rem 1.25rem;
  background: var(--accent-soft);
  border: 1px solid var(--border); border-left: 3px solid var(--accent);
  border-radius: .375rem;
  white-space: pre-wrap;
  font-size: .9375rem; line-height: 1.7;
}

.etiketler { list-style: none; display: flex; flex-wrap: wrap; gap: .375rem; margin: .75rem 0 0; padding: 0; }
.etiket {
  display: inline-block; padding: .125rem .5rem;
  font-size: .8125rem;
  background: var(--surface); border: 1px solid var(--border); border-radius: 1rem;
}
.etiket:hover { border-color: var(--accent); color: var(--accent); }

/* ---------- alt bilgi ---------- */

.alt-bilgi {
  border-top: 1px solid var(--border);
  padding: 1.5rem 1rem;
  text-align: center;
  font-size: .75rem;
  color: var(--muted);
}