/* Agapedia — klasik ansiklopedi görünümü */
:root {
  --link: #0645ad;
  --link-visited: #0b0080;
  --link-new: #ba0000;
  --border: #a7d7f9;
  --text: #202122;
  --muted: #54595d;
  --bg: #f6f6f6;
  --box: #f8f9fa;
  --box-border: #a2a9b1;
  --serif: 'Linux Libertine', 'Georgia', 'Times', serif;
}
* { box-sizing: border-box; }
html { font-size: 100%; }
body {
  margin: 0; background: var(--bg); color: var(--text);
  font-family: sans-serif; font-size: 0.875em; line-height: 1.6;
}
a { color: var(--link); text-decoration: none; }
a:visited { color: var(--link-visited); }
a:hover { text-decoration: underline; }
a.new, a.new:visited { color: var(--link-new); }
a.external::after { content: ' ↗'; font-size: .8em; }
[hidden] { display: none !important; }
#boot { padding: 3em; text-align: center; color: var(--muted); }

/* ---------- Genel yerleşim ---------- */
#app {
  display: grid;
  grid-template-columns: 11em minmax(0, 1fr);
  grid-template-rows: 5em auto auto;
  grid-template-areas: "panel head" "panel content" "panel footer";
  min-height: 100vh;
  background: linear-gradient(#fff 0, #fff 2.5em, var(--bg) 5em) no-repeat;
}
#mw-panel { grid-area: panel; padding: 0 .6em 2em .5em; font-size: .93em; }
#mw-head { grid-area: head; display: flex; flex-direction: column; justify-content: space-between; min-width: 0; }
#content {
  grid-area: content; background: #fff; border: 1px solid var(--border); border-right: 0;
  padding: 1.25em 1.5em 1.5em; min-width: 0; margin-top: -1px;
}
#footer { grid-area: footer; padding: 1em 1.5em 2em; font-size: .8em; color: var(--muted); }
#footer p { margin: .4em 0; }

/* ---------- Sol panel ---------- */
#p-logo { display: block; text-align: center; padding: .4em 0 .6em; }
/* multiply: logonun beyaz zemini arka plana karışır */
#p-logo img { max-width: 100%; height: auto; mix-blend-mode: multiply; }
.portal { margin: 0 .3em .9em; }
.portal h3 {
  font-size: .82em; font-weight: normal; color: var(--muted); margin: 0 0 .2em;
  padding: .25em 0; border-bottom: 1px solid #c8ccd1; cursor: default;
}
.portal ul { list-style: none; margin: 0; padding: .3em 0 0; }
.portal li { margin: 0; padding: .22em 0; line-height: 1.2; font-size: .9em; }
.portal li.plain { color: var(--muted); }

/* ---------- Üst kısım ---------- */
#head-top { display: flex; justify-content: flex-end; align-items: center; padding: .35em 1em 0; }
#menu-toggle, #mobile-brand { display: none; }
#p-personal { list-style: none; margin: 0; padding: 0; display: flex; gap: 1em; font-size: .82em; flex-wrap: wrap; justify-content: flex-end; }
#p-personal li { white-space: nowrap; }
#p-personal .anon { color: var(--muted); }
#p-personal button { background: none; border: 0; padding: 0; font: inherit; color: var(--link); cursor: pointer; }
#p-personal button:hover { text-decoration: underline; }
#head-bottom { display: flex; justify-content: space-between; align-items: flex-end; gap: 1em; }
#right-navigation { display: flex; align-items: flex-end; }
.tabs { list-style: none; margin: 0; padding: 0; display: flex; height: 2.5em; }
.tabs li {
  background: linear-gradient(to top, #e8f2f8 0, #fff 100%);
  border-left: 1px solid transparent;
  border-image: linear-gradient(to bottom, #fff 0, var(--border) 100%) 1;
  white-space: nowrap;
}
.tabs li:last-child { border-right: 1px solid; border-image: linear-gradient(to bottom, #fff 0, var(--border) 100%) 1; }
.tabs li a, .tabs li button {
  display: block; height: 100%; padding: 1.15em .7em 0; font-size: .86em; color: var(--link);
  background: none; border: 0; font-family: inherit; cursor: pointer; line-height: 1.2;
}
.tabs li a.new { color: var(--link-new); }
.tabs li.selected { background: #fff; }
.tabs li.selected a { color: var(--text); text-decoration: none; }
.tabs li.star button { font-size: 1.05em; padding-top: .85em; color: #b58900; }

#searchform { position: relative; margin: 0 1em .45em .8em; }
#simpleSearch { display: flex; border: 1px solid #a2a9b1; background: #fff; border-radius: 2px; width: 17em; max-width: 100%; }
#simpleSearch:focus-within { border-color: #36c; box-shadow: inset 0 0 0 1px #36c; }
#searchInput { flex: 1; min-width: 0; border: 0; outline: 0; padding: .35em .5em; font-size: .9em; background: transparent; }
#searchButton { border: 0; background: transparent; cursor: pointer; padding: 0 .5em; }
#search-suggestions {
  position: absolute; z-index: 50; top: 100%; left: 0; right: 0; margin: 0; padding: 0; list-style: none;
  background: #fff; border: 1px solid #a2a9b1; border-top: 0; box-shadow: 0 2px 4px rgba(0,0,0,.2);
}
#search-suggestions li a { display: block; padding: .3em .6em; color: var(--text); }
#search-suggestions li a:hover, #search-suggestions li.active a { background: #eaf3ff; text-decoration: none; }
#search-suggestions li.more a { color: var(--link); border-top: 1px solid #eaecf0; font-style: italic; }

/* ---------- İçerik ---------- */
#demo-banner { background: #fef6e7; border: 1px solid #fc3; padding: .5em .8em; margin-bottom: 1em; font-size: .92em; }
h1.firstHeading {
  font-family: var(--serif); font-weight: normal; font-size: 1.8em; line-height: 1.3;
  margin: 0 0 .15em; padding: 0; border-bottom: 1px solid #a2a9b1; overflow-wrap: anywhere;
}
h1.firstHeading .featured-star { color: #d4a017; font-size: .7em; vertical-align: middle; margin-left: .3em; cursor: help; }
#siteSub { font-size: .92em; color: var(--text); margin-bottom: 1.1em; }
.mw-body h2, .mw-body h3, .mw-body h4 { overflow: hidden; margin: 1em 0 .25em; line-height: 1.3; }
.mw-body h2 { font-family: var(--serif); font-weight: normal; font-size: 1.5em; border-bottom: 1px solid #a2a9b1; padding-bottom: .1em; }
.mw-body h3 { font-size: 1.2em; }
.mw-body h4 { font-size: 1em; }
.mw-body h5, .mw-body h6 { font-size: .95em; margin: .8em 0 .2em; }
.mw-body p { margin: .5em 0; }
.mw-body ul { list-style: disc; margin: .3em 0 0 1.6em; padding: 0; }
.mw-body ol { margin: .3em 0 0 3.2em; padding: 0; }
.mw-body li { margin-bottom: .1em; }
.mw-body dl { margin: .2em 0 .5em; }
.mw-body dd { margin-left: 1.6em; }
.mw-body hr { height: 1px; border: 0; background: #a2a9b1; margin: .6em 0; }
.mw-body blockquote { margin: 1em 2.5em; padding: .2em 1em; border-left: 4px solid #eaecf0; font-family: var(--serif); font-size: 1.05em; }
.mw-body blockquote cite { display: block; text-align: right; font-size: .9em; font-style: normal; color: var(--muted); }
.mw-body code { background: #f8f9fa; border: 1px solid #eaecf0; padding: 1px 4px; border-radius: 2px; }
.mw-body::after { content: ''; display: block; clear: both; }
.hatnote { font-style: italic; padding-left: 1.6em; margin: .4em 0; }
sup.reference, sup.inline-tag { font-size: .8em; line-height: 1; white-space: nowrap; }
sup.inline-tag { font-style: italic; }
.tpl-unknown { color: var(--link-new); font-family: monospace; }

/* İçindekiler */
.toc { display: inline-block; background: var(--box); border: 1px solid var(--box-border); padding: .5em .9em; margin: .8em 0; font-size: .95em; }
.toc .toctitle { text-align: center; font-weight: bold; }
.toc .toctoggle { font-weight: normal; font-size: .9em; margin-left: .4em; }
.toc .toctoggle button { background: none; border: 0; color: var(--link); cursor: pointer; padding: 0; font: inherit; }
.toc ul { list-style: none; margin: .3em 0 0; padding: 0; }
.toc ul ul { margin: 0 0 0 2em; }
.toc .tocnumber { color: var(--text); padding-right: .5em; }

/* Bilgi kutusu */
.infobox {
  float: right; clear: right; width: 22em; max-width: 100%; margin: .3em 0 1em 1.2em;
  background: var(--box); border: 1px solid var(--box-border); border-spacing: 3px; font-size: .88em; line-height: 1.5;
}
.infobox caption, .infobox .infobox-title { font-size: 1.25em; font-weight: bold; text-align: center; padding: .25em; background: #cedff2; }
.infobox th { text-align: left; vertical-align: top; padding: .2em .5em; width: 38%; }
.infobox td { vertical-align: top; padding: .2em .5em; overflow-wrap: anywhere; }
.infobox .infobox-image { text-align: center; padding: .4em; }
.infobox img { max-width: 100%; height: auto; }
.infobox .infobox-caption { font-size: .92em; color: var(--muted); }
.thumb { float: right; clear: right; display: block; margin: .4em 0 1em 1.2em; padding: 3px; border: 1px solid #c8ccd1; background: var(--box); width: 230px; max-width: 100%; font-size: .88em; }
.thumb img { display: block; max-width: 100%; height: auto; border: 1px solid #c8ccd1; }
.thumb .thumbcaption { display: block; padding: 3px; line-height: 1.4; }

/* Uyarı kutuları (ambox) */
.ambox {
  display: flex; gap: .8em; align-items: center; margin: .5em 8%; padding: .45em .8em;
  background: #fbfbfb; border: 1px solid var(--box-border); border-left: 10px solid #36c; font-size: .95em;
}
.ambox .ambox-icon { font-size: 1.7em; line-height: 1; flex: none; }
.ambox.orange { border-left-color: #f28500; }
.ambox.red { border-left-color: #b32424; }
.ambox.yellow { border-left-color: #fc3; }
.ambox.purple { border-left-color: #9932cc; }
.ambox small { display: block; color: var(--muted); }

/* Kaynakça, kategoriler */
ol.references { font-size: .9em; margin-left: 2.6em; }
ol.references li:target, ol.references li.hl, sup.reference.hl { background: #eaf3ff; }
.catlinks { clear: both; border: 1px solid var(--box-border); background: var(--box); padding: .4em .7em; margin-top: 1.5em; }
.catlinks ul { display: inline; list-style: none; margin: 0; padding: 0; }
.catlinks li { display: inline; padding: 0 .6em; border-left: 1px solid #a2a9b1; }
.catlinks li:first-child { border-left: 0; padding-left: .3em; }
.lastmod { clear: both; font-size: .8em; color: var(--muted); margin-top: 1.2em; }

/* Bildirim kutuları */
.notice { border: 1px solid var(--box-border); background: var(--box); padding: .6em .9em; margin: .6em 0 1em; }
.notice.warn { background: #fef6e7; border-color: #fc3; }
.notice.error { background: #fee7e6; border-color: #d33; }
.notice.ok { background: #d5fdf4; border-color: #14866d; }

/* ---------- Formlar ---------- */
.btn {
  font: inherit; font-weight: bold; padding: .4em .9em; border: 1px solid #a2a9b1; border-radius: 2px;
  background: #f8f9fa; color: var(--text); cursor: pointer;
}
.btn:hover { background: #fff; border-color: #72777d; }
.btn.primary { background: #36c; border-color: #36c; color: #fff; }
.btn.primary:hover { background: #447ff5; }
.btn.danger { color: #d33; }
.btn:disabled { opacity: .55; cursor: default; }
.btn.link { border: 0; background: none; color: var(--link); font-weight: normal; padding: .4em .3em; }
input[type=text], input[type=password], textarea, select {
  font: inherit; padding: .4em .5em; border: 1px solid #a2a9b1; border-radius: 2px; background: #fff; color: var(--text); max-width: 100%;
}
input:focus, textarea:focus { outline: 0; border-color: #36c; box-shadow: inset 0 0 0 1px #36c; }
.form-row { margin: .7em 0; }
.form-row label { display: block; font-weight: bold; margin-bottom: .2em; }
.form-row .hint { font-size: .88em; color: var(--muted); }
.form-narrow input[type=text], .form-narrow input[type=password] { width: 22em; }

.edit-toolbar { display: flex; flex-wrap: wrap; gap: 2px; background: #f8f9fa; border: 1px solid #a2a9b1; border-bottom: 0; padding: 3px; }
.edit-toolbar button, .edit-toolbar select { font: inherit; font-size: .92em; min-width: 2.2em; padding: .25em .5em; border: 1px solid transparent; background: none; cursor: pointer; border-radius: 2px; }
.edit-toolbar button:hover, .edit-toolbar select:hover { border-color: #a2a9b1; background: #fff; }
#wpTextbox { display: block; width: 100%; min-height: 26em; font-family: monospace, monospace; font-size: 1em; line-height: 1.5; resize: vertical; border-radius: 0; }
#wpSummary { width: 100%; }
.edit-buttons { display: flex; flex-wrap: wrap; gap: .5em; align-items: center; margin-top: .8em; }
.preview-box { border: 1px solid #fc3; margin-bottom: 1.2em; }
.preview-box > .preview-head { background: #fef6e7; padding: .4em .8em; border-bottom: 1px solid #fc3; }
.preview-box > .mw-body { padding: .6em 1em 1em; }

/* ---------- Geçmiş, son değişiklikler ---------- */
ul.history, ul.changes { list-style: none; margin: .6em 0; padding: 0; }
ul.history li, ul.changes li { padding: .25em .3em; border-bottom: 1px solid #f0f0f0; overflow-wrap: anywhere; }
ul.history li:hover, ul.changes li:hover { background: #f8f9fa; }
ul.history input[type=radio] { margin: 0 .25em; vertical-align: middle; }
.rc-day { font-size: 1.1em; font-weight: bold; margin: 1em 0 .2em; }
.delta-pos { color: #006400; } .delta-neg { color: #8b0000; } .delta-zero { color: #72777d; }
.delta-big { font-weight: bold; }
.comment { font-style: italic; color: var(--muted); }
.newpage-flag { font-weight: bold; }
.btn-inline { background: none; border: 0; padding: 0; color: var(--link); font: inherit; cursor: pointer; }
.btn-inline:hover { text-decoration: underline; }

/* ---------- Fark (diff) ---------- */
table.diff { width: 100%; table-layout: fixed; border-collapse: separate; border-spacing: 4px 2px; font-size: .92em; }
table.diff col.marker { width: 1.6em; } table.diff col.side { width: 50%; }
table.diff th { font-weight: normal; padding: .4em; text-align: center; vertical-align: top; }
table.diff td { vertical-align: top; padding: .15em .4em; font-family: monospace, monospace; white-space: pre-wrap; overflow-wrap: anywhere; border-radius: 2px; }
table.diff td.marker { text-align: right; font-weight: bold; padding: .15em 0; font-size: 1.1em; }
table.diff td.lineno { font-family: sans-serif; font-weight: bold; padding-top: .6em; }
table.diff td.del { background: #feeec8; border: 1px solid #ffe49c; }
table.diff td.add { background: #d8ecff; border: 1px solid #a3d3ff; }
table.diff td.ctx { background: #f8f9fa; border: 1px solid #eaecf0; color: var(--muted); }
table.diff del { background: #ffc86a; text-decoration: none; font-weight: bold; }
table.diff ins { background: #8fc7ff; text-decoration: none; font-weight: bold; }

/* ---------- Ana sayfa ---------- */
.mp-welcome { background: var(--box); border: 1px solid var(--box-border); padding: .8em 1.2em; text-align: center; margin-bottom: 1em; }
.mp-welcome h1 { font-family: var(--serif); font-weight: normal; font-size: 1.9em; margin: 0; border: 0; }
.mp-welcome .mw-body p { margin: .2em 0; }
.mp-grid { display: grid; grid-template-columns: 55% 1fr; gap: 1em; }
.mp-box { border: 1px solid; padding: 0 .9em .8em; min-width: 0; }
.mp-box h2 { font-family: sans-serif; font-size: 1.1em; font-weight: bold; margin: .7em 0 .5em; padding: .25em .5em; border: 1px solid; }
.mp-box.green { background: #f5fffa; border-color: #cef2e0; } .mp-box.green h2 { background: #cef2e0; border-color: #a3bfb1; }
.mp-box.blue { background: #f5faff; border-color: #cedff2; } .mp-box.blue h2 { background: #cedff2; border-color: #a3b0bf; }
.mp-box.purple { background: #faf5ff; border-color: #ddcef2; } .mp-box.purple h2 { background: #ddcef2; border-color: #afa3bf; }
.mp-box.wide { grid-column: 1 / -1; }
.mp-box ul { margin-left: 1.4em; padding: 0; }
.mp-stat { font-family: var(--serif); font-size: 2.2em; line-height: 1.1; }
.mp-more { text-align: right; font-size: .92em; margin-top: .5em; }

.cat-columns, .all-columns { column-width: 16em; column-gap: 2em; }
.cat-columns h3 { margin: .4em 0 .1em; }
.cat-columns ul, .all-columns ul { margin-top: 0; }

/* ---------- Site parolası / kurulum ekranı ---------- */
#gate-root { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 1.5em; }
.gate-card { background: #fff; border: 1px solid var(--border); padding: 1.5em 2em 2em; width: 30em; max-width: 100%; text-align: center; }
.gate-card h1 { font-family: var(--serif); font-weight: normal; font-size: 1.7em; margin: .3em 0 .2em; }
.gate-card form { text-align: left; margin-top: 1.2em; }
.gate-card input[type=text], .gate-card input[type=password] { width: 100%; }
.gate-card .btn { width: 100%; margin-top: .6em; }

/* ---------- Mobil ---------- */
@media (max-width: 760px) {
  #app { display: block; background: var(--bg); }
  #mw-panel {
    position: fixed; z-index: 100; top: 0; bottom: 0; left: 0; width: 14em; max-width: 80vw; overflow-y: auto;
    background: var(--bg); border-right: 1px solid var(--border); box-shadow: 2px 0 8px rgba(0,0,0,.2);
    transform: translateX(-105%); transition: transform .15s; font-size: 1em;
  }
  body.menu-open #mw-panel { transform: none; }
  body.menu-open::after { content: ''; position: fixed; inset: 0; background: rgba(0,0,0,.35); z-index: 90; }
  #p-logo img { width: 110px; }
  #mw-head { background: #fff; }
  #head-top { justify-content: flex-start; gap: .6em; padding: .4em .6em; }
  #menu-toggle { display: block; font-size: 1.4em; background: none; border: 0; cursor: pointer; padding: 0 .3em; line-height: 1; }
  #mobile-brand { display: block; font-family: var(--serif); font-size: 1.35em; color: var(--text); }
  #p-personal { margin-left: auto; }
  #head-bottom { flex-direction: column-reverse; align-items: stretch; gap: 0; }
  #right-navigation { flex-direction: column-reverse; align-items: stretch; }
  #searchform { margin: .2em .6em .5em; }
  #simpleSearch { width: 100%; }
  .tabs { overflow-x: auto; height: 2.4em; border-bottom: 1px solid var(--border); }
  .tabs li a, .tabs li button { padding-top: .8em; }
  #content { border-left: 0; padding: 1em .8em 1.2em; margin-top: 0; }
  h1.firstHeading { font-size: 1.6em; }
  .infobox, .thumb { float: none; width: 100%; margin: .6em 0 1em; }
  .toc { display: block; }
  .ambox { margin: .5em 0; }
  .mp-grid { grid-template-columns: 1fr; }
  .mw-body blockquote { margin: 1em .5em; }
  table.diff { font-size: .8em; border-spacing: 2px; }
  .form-narrow input[type=text], .form-narrow input[type=password] { width: 100%; }
  #wpTextbox { min-height: 18em; }
}
