/* Yasal belgeler: okunmak icin tasarlanmis tek sutun, yanda gezinme. */

.body--belge { background: var(--mist); }

.wrap { width: min(1120px, 100% - 2.5rem); margin-inline: auto; }

/* ---------- Ust cubuk ---------- */
.doc-top { background: var(--ink); padding: var(--space-4) 0; }
.doc-top__in { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); }
.doc-top__brand { line-height: 0; }

/* ---------- Yerlesim ---------- */
.doc { padding: var(--space-7) 0 var(--space-8); }
.doc__in {
  display: grid;
  grid-template-columns: 15rem minmax(0, 1fr);
  gap: var(--space-7);
  align-items: start;
}

/* ---------- Yan gezinme ---------- */
.doc__side {
  position: sticky;
  top: var(--space-5);
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  padding: var(--space-5);
}
.doc__sidetitle {
  font-size: var(--text-xs);
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--sky-deep);
  margin-bottom: var(--space-4);
}
.doc__side ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0.1rem; }
.doc__link {
  display: block;
  padding: 0.5rem 0.7rem;
  border-radius: var(--radius-sm);
  font-size: var(--text-sm);
  font-weight: 500;
  color: var(--text-2);
  border-left: 2px solid transparent;
}
.doc__link:hover { background: var(--surface-2); color: var(--ink); text-decoration: none; }
.doc__link--on {
  background: var(--sky-soft);
  border-left-color: var(--sky-deep);
  color: var(--ink);
  font-weight: 600;
}
.doc__updated {
  margin-top: var(--space-5);
  padding-top: var(--space-4);
  border-top: 1px solid var(--line);
  font-size: var(--text-xs);
  color: var(--text-3);
  line-height: 1.7;
}
.doc__updated strong { color: var(--text-2); }

/* ---------- Belge govdesi ---------- */
.doc__body {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  padding: clamp(1.75rem, 1rem + 3vw, 3.25rem);
}
.doc__eyebrow {
  font-size: var(--text-xs);
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--sky-deep);
  margin-bottom: var(--space-3);
}
.doc__body h1 {
  font-size: clamp(1.7rem, 1.2rem + 1.8vw, 2.4rem);
  color: var(--ink);
  margin-bottom: var(--space-5);
}
.doc__lead {
  font-size: var(--text-md);
  color: var(--text-2);
  line-height: 1.7;
  padding-bottom: var(--space-5);
  border-bottom: 1px solid var(--line);
}
.doc__body h2 {
  font-size: var(--text-md);
  color: var(--ink);
  margin: var(--space-6) 0 var(--space-3);
  padding-top: var(--space-2);
}
.doc__body p { margin-bottom: var(--space-3); line-height: 1.75; max-width: 68ch; }
.doc__body strong { color: var(--ink); font-weight: 600; }
.doc__body code {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 0.85em;
  background: var(--surface-2);
  padding: 0.1rem 0.35rem;
  border-radius: 4px;
}

/* Doldurulmamis kurumsal alan: uydurulmaz, isaretlenir. */
.todo {
  background: var(--warn-bg);
  color: var(--warn);
  font-weight: 600;
  padding: 0.05rem 0.4rem;
  border-radius: 4px;
}

/* ---------- Listeler ---------- */
.doc__list { margin: 0 0 var(--space-4); padding-left: 1.2rem; max-width: 68ch; }
.doc__list li { margin-bottom: 0.65rem; line-height: 1.7; }
.doc__list--tight li { margin-bottom: 0.35rem; }
.doc__list::marker { color: var(--sky-deep); }

/* ---------- Tablolar ---------- */
.doc__table {
  width: 100%;
  border-collapse: collapse;
  margin: 0 0 var(--space-5);
  font-size: var(--text-sm);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  overflow: hidden;
}
.doc__table th,
.doc__table td { padding: 0.7rem 0.9rem; text-align: left; border-bottom: 1px solid var(--line); vertical-align: top; }
.doc__table tr:last-child th,
.doc__table tr:last-child td { border-bottom: 0; }
.doc__table th {
  background: var(--surface-2);
  font-weight: 600;
  color: var(--text-2);
  white-space: nowrap;
  width: 11rem;
}
.doc__table--wide { display: block; overflow-x: auto; }
.doc__table--wide thead th { width: auto; white-space: nowrap; }
.doc__table--wide tbody th { width: auto; }

/* ---------- Iki kutu ---------- */
.doc__split {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: var(--space-4);
  margin-bottom: var(--space-5);
}
.doc__box {
  background: var(--surface-2);
  border-radius: var(--radius);
  padding: var(--space-4);
}
.doc__boxtitle {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: var(--text-sm);
  color: var(--ink);
  margin-bottom: 0.4rem;
}
.doc__box p { font-size: var(--text-sm); margin: 0; }

/* ---------- Vurgu kutusu ---------- */
.doc__callout {
  background: var(--sky-soft);
  border-left: 3px solid var(--sky-deep);
  border-radius: 0 var(--radius) var(--radius) 0;
  padding: var(--space-4) var(--space-5);
  margin: var(--space-5) 0;
}
.doc__callout--ok { background: var(--ok-bg); border-left-color: var(--ok); }
.doc__callouttitle {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: var(--text-sm);
  color: var(--ink);
  margin-bottom: 0.4rem;
}
.doc__callout p:last-child { margin-bottom: 0; font-size: var(--text-sm); }

/* ---------- Belge alt bilgisi ---------- */
.doc__foot {
  margin-top: var(--space-7);
  padding-top: var(--space-4);
  border-top: 1px solid var(--line);
  display: flex;
  gap: var(--space-5);
  flex-wrap: wrap;
  font-size: var(--text-xs);
  color: var(--text-3);
}
.doc__foot p { margin: 0; }

/* ---------- Sayfa alt bilgisi ---------- */
.doc-bottom { background: var(--ink); color: var(--text-on-ink-2); padding: var(--space-5) 0; }
.doc-bottom__in {
  display: flex;
  align-items: center;
  gap: var(--space-4) var(--space-5);
  flex-wrap: wrap;
  font-size: var(--text-xs);
}
.doc-bottom nav { display: flex; gap: var(--space-4); flex-wrap: wrap; }
.doc-bottom a { color: var(--text-on-ink-2); }
.doc-bottom a:hover { color: #fff; }
.doc-bottom__ver { margin-left: auto; color: var(--text-3); }

@media (max-width: 900px) {
  .doc__in { grid-template-columns: 1fr; }
  .doc__side { position: static; }
  .doc__side ul { flex-direction: row; flex-wrap: wrap; gap: 0.3rem; }
  .doc__link { border-left: 0; border-bottom: 2px solid transparent; }
  .doc__link--on { border-left: 0; border-bottom-color: var(--sky-deep); }
}