/* Yönetim Yazma — arayüz stilleri
   Tek dosya. Harici yazı tipi, CDN, satır içi stil yok (CSP: default-src 'self').
   Görsel dil: kurumsal yazışma kâğıdı. Çalışma alanı sakin bir "masa", metin ise
   kurumun kendi belgelerindeki gibi serif dizilmiş bir A4 sayfa üzerinde düzenlenir. */

/* ------------------------------------------------------------------ 1. Tokens */
:root {
  color-scheme: light dark;

  --font-ui: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
  --font-doc: "Times New Roman", "Liberation Serif", Tinos, "Nimbus Roman", "Noto Serif", Times, serif;

  --fs-xs: .8125rem;
  --fs-sm: .875rem;
  --fs-base: 1rem;
  --fs-lg: 1.125rem;
  --fs-xl: 1.375rem;
  --lh-tight: 1.25;
  --lh-ui: 1.5;

  --radius-s: 3px;
  --radius-m: 6px;
  --gutter: clamp(16px, 4vw, 56px);          /* FAZ 5E: fluid side margin */
  --wrap-max: 1600px;                         /* FAZ 5E: the application container never exceeds this width */
  --measure: 46rem;
  --aside: 21rem;

  /* Işık teması */
  --c-ink: #1b2733;
  --c-ink-2: #46535f;
  --c-ink-3: #5a6773;
  --c-desk: #e9edf0;
  --c-surface: #ffffff;
  --c-surface-2: #f3f6f8;
  --c-field: #ffffff;
  --c-line: #c9d1d8;
  --c-line-strong: #7b8895;
  --c-accent: #17485a;
  --c-accent-bg: #17485a;
  --c-accent-bg-hover: #0f3745;
  --c-on-accent: #ffffff;
  --c-accent-soft: #dfecf0;
  --c-link: #14506a;
  --c-focus: #1a5fd0;
  --c-ok: #1f6b45;
  --c-ok-soft: #e2f2e9;
  --c-warn: #7a4a00;
  --c-warn-soft: #fff1cf;
  --c-err: #9b2c2c;
  --c-err-soft: #fbe9e7;
  --c-info: #17485a;
  --c-info-soft: #e3eef2;
  --c-mark: #ffe27a;
  --c-mark-edge: #8a6d00;
  --c-backdrop: rgba(15, 25, 35, .55);

  /* Kâğıt: belge yüzeyi her iki temada da açık kalır (gerçek belge gibi). */
  --p-paper: #ffffff;
  --p-ink: #1b2733;
  --p-ink-2: #46535f;
  --p-ink-3: #5a6773;
  --p-line: #c9d1d8;
  --p-line-strong: #7b8895;
  --p-tint: #eef2f5;
  --p-accent: #17485a;
  --p-accent-bg: #17485a;
  --p-focus: #1a5fd0;
  --p-surface-2: #f3f6f8;
  --p-mark: #ffe27a;
  --p-mark-edge: #8a6d00;
}

@media (prefers-color-scheme: dark) {
  :root {
    --c-ink: #e7ecf1;
    --c-ink-2: #b8c3ce;
    --c-ink-3: #97a4b1;
    --c-desk: #12181e;
    --c-surface: #1a222a;
    --c-surface-2: #222c36;
    --c-field: #141b21;
    --c-line: #34414d;
    --c-line-strong: #7d8b98;
    --c-accent: #86c5da;
    --c-accent-bg: #2e7590;
    --c-accent-bg-hover: #357f98;
    --c-on-accent: #ffffff;
    --c-accent-soft: #1f3a45;
    --c-link: #8fcde2;
    --c-focus: #7db4ff;
    --c-ok: #7fd4a4;
    --c-ok-soft: #1b3326;
    --c-warn: #f2c26b;
    --c-warn-soft: #3a2d12;
    --c-err: #ff9d97;
    --c-err-soft: #3b2021;
    --c-info: #8fcde2;
    --c-info-soft: #1d3039;
    --c-mark: #7a6200;
    --c-mark-edge: #ffe27a;
    --c-backdrop: rgba(0, 0, 0, .65);
  }
}

/* ------------------------------------------------------------------ 2. Base */
*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scroll-padding-top: 5.5rem;
}

body {
  margin: 0;
  min-height: 100vh;
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
  background: var(--c-desk);
  color: var(--c-ink);
  font: 400 var(--fs-base)/var(--lh-ui) var(--font-ui);
  -webkit-font-smoothing: antialiased;
}

main { flex: 1 0 auto; padding-block: 1.5rem 3rem; }
main:focus { outline: none; }

h1, h2, h3, h4 { margin: 0; line-height: var(--lh-tight); }
p { margin: 0; }
ul, ol { margin: 0; }
dl, dd { margin: 0; }
button, input, select, textarea { font: inherit; color: inherit; }
img, svg { max-width: 100%; }

a { color: var(--c-link); text-underline-offset: .18em; }
a:hover { text-decoration-thickness: 2px; }

:focus-visible {
  outline: 3px solid var(--c-focus);
  outline-offset: 2px;
}

::selection { background: var(--c-accent-soft); color: var(--c-ink); }

.visually-hidden {
  position: absolute !important;
  width: 1px; height: 1px;
  margin: -1px; padding: 0; border: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
}

.sprite { position: absolute; width: 0; height: 0; overflow: hidden; }

.icon {
  width: 1.125rem; height: 1.125rem; flex: none;
  stroke: currentColor; fill: none;
  stroke-width: 2; stroke-linecap: round; stroke-linejoin: round;
}
.icon--lg { width: 1.5rem; height: 1.5rem; }
.icon--spin { animation: yy-spin 1s linear infinite; }
@keyframes yy-spin { to { transform: rotate(360deg); } }

.skip-link {
  position: absolute; left: .75rem; top: -4rem; z-index: 100;
  padding: .6rem 1rem; border-radius: var(--radius-s);
  background: var(--c-accent-bg); color: var(--c-on-accent); font-weight: 600;
}
.skip-link:focus { top: .75rem; }

.wrap { width: min(100% - 2 * var(--gutter), var(--wrap-max)); margin-inline: auto; }

/* ------------------------------------------------------------------ 3. Header / footer */
.app-header {
  background: var(--c-surface);
  border-bottom: 1px solid var(--c-line);
  box-shadow: inset 0 4px 0 var(--c-accent-bg);
}
.app-header__inner {
  display: flex; flex-wrap: wrap; align-items: center;
  gap: .25rem 1.75rem;
  padding-block: calc(.35rem + 4px) .35rem;
  min-height: 3.5rem;
}
.brand { display: inline-flex; align-items: center; gap: .65rem; color: var(--c-ink); text-decoration: none; }
.brand__mark { display: block; border-radius: 5px; }
.brand__name { font: 600 1.0625rem/1 var(--font-doc); letter-spacing: .16em; }

.main-nav ul { display: flex; flex-wrap: wrap; gap: .25rem; list-style: none; padding: 0; }
.main-nav a {
  display: inline-flex; align-items: center; min-height: 2.5rem; padding: 0 .75rem;
  color: var(--c-ink-2); text-decoration: none; font-size: var(--fs-sm); font-weight: 500;
  border-bottom: 3px solid transparent;
}
.main-nav a:hover { color: var(--c-ink); border-bottom-color: var(--c-line-strong); }
.main-nav a[aria-current="page"] { color: var(--c-ink); font-weight: 700; border-bottom-color: var(--c-accent-bg); }

.logout-form { margin: 0; margin-inline-start: auto; }

.app-footer { border-top: 1px solid var(--c-line); background: var(--c-surface); color: var(--c-ink-2); font-size: var(--fs-xs); }
.app-footer__inner { display: grid; gap: .35rem; padding-block: 1rem; }
.app-footer__line { display: flex; gap: .5rem; align-items: flex-start; }
.app-footer__line .icon { width: 1rem; height: 1rem; margin-top: .1rem; }

/* ------------------------------------------------------------------ 4. Typography blocks */
.letterhead {
  text-align: center;
  padding: 1.25rem 0 1.25rem;
  margin-bottom: 1.75rem;
  border-bottom: 4px double var(--c-accent-bg);
}
.letterhead__name {
  font: 600 clamp(1.75rem, 1.2rem + 2.6vw, 2.5rem)/1.1 var(--font-doc);
  letter-spacing: .2em; padding-inline-start: .2em;
}
.letterhead__sub { margin-top: .6rem; color: var(--c-ink-2); }

.page-title { font: 700 var(--fs-xl)/1.2 var(--font-ui); letter-spacing: .02em; }
.subsection-title { font: 700 var(--fs-base)/1.3 var(--font-ui); }
.muted { color: var(--c-ink-2); }
.small { font-size: var(--fs-sm); }
.nowrap { white-space: nowrap; }

/* ------------------------------------------------------------------ 5. Buttons */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  min-height: 2.5rem; padding: .45rem .95rem;
  border: 1px solid var(--c-line-strong); border-radius: var(--radius-s);
  background: var(--c-surface); color: var(--c-ink);
  font: 600 var(--fs-sm)/1.2 var(--font-ui);
  text-decoration: none; cursor: pointer; white-space: nowrap;
}
.btn:hover { background: var(--c-surface-2); border-color: var(--c-ink-2); }
.btn[disabled], .btn[aria-disabled="true"] { opacity: .5; cursor: not-allowed; }
.btn[disabled]:hover, .btn[aria-disabled="true"]:hover { background: var(--c-surface); border-color: var(--c-line-strong); }

.btn--primary { background: var(--c-accent-bg); border-color: var(--c-accent-bg); color: var(--c-on-accent); }
.btn--primary:hover { background: var(--c-accent-bg-hover); border-color: var(--c-accent-bg-hover); }
.btn--primary[disabled]:hover { background: var(--c-accent-bg); border-color: var(--c-accent-bg); }
.btn--quiet { border-color: transparent; background: transparent; }
.btn--quiet:hover { border-color: var(--c-line); }
.btn--danger { color: var(--c-err); border-color: var(--c-err); }
.btn--sm { min-height: 2.125rem; padding: .25rem .65rem; font-size: var(--fs-xs); }
.btn--lg { min-height: 3.125rem; padding-inline: 1.75rem; font-size: var(--fs-base); letter-spacing: .08em; }
.btn--block { width: 100%; }

.link-btn {
  display: inline; padding: 0; border: 0; background: none; cursor: pointer;
  color: var(--c-link); font: inherit; text-decoration: underline; text-underline-offset: .18em;
}

@media (pointer: coarse) {
  .btn { min-height: 2.75rem; }
  .btn--sm { min-height: 2.5rem; }
}

/* ------------------------------------------------------------------ 6. Forms */
/* align-content: start — a field that sits in a taller grid row (two-column "Gelişmiş seçenekler") must not stretch its rows. */
.field { display: grid; align-content: start; gap: .4rem; margin-bottom: 1.25rem; }
.field__label { font: 700 var(--fs-xs)/1.3 var(--font-ui); letter-spacing: .09em; color: var(--c-ink); }
.field__label--plain { letter-spacing: 0; font-size: var(--fs-sm); }
.field__hint { color: var(--c-ink-3); font-size: var(--fs-sm); }
.field__error { display: flex; gap: .4rem; align-items: flex-start; color: var(--c-err); font-size: var(--fs-sm); font-weight: 600; }

.control {
  display: block; width: 100%; min-height: 2.75rem; padding: .6rem .8rem;
  border: 1px solid var(--c-line-strong); border-radius: var(--radius-s);
  background: var(--c-field); color: var(--c-ink);
}
.control:hover { border-color: var(--c-ink-2); }
.control:focus-visible { outline-offset: 1px; border-color: var(--c-ink); }
.control[aria-invalid="true"] { border-color: var(--c-err); border-width: 2px; padding: calc(.6rem - 1px) calc(.8rem - 1px); }
.control--request { min-height: 11rem; font-size: 1.0625rem; line-height: 1.55; resize: vertical; }
.control--area { min-height: 5.5rem; resize: vertical; }
select.control { padding-inline-end: 2rem; text-overflow: ellipsis; }

.field-row { display: grid; gap: 0 1.25rem; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 40em) { .field-row--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } .field-row--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.compose {
  background: var(--c-surface);
  border: 1px solid var(--c-line);
  border-radius: var(--radius-m);
  padding: clamp(1rem, 3vw, 1.75rem);
}
.compose__actions { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem 1rem; margin-top: 1.25rem; }

.disclosure { border-top: 1px solid var(--c-line); margin-top: .25rem; padding-top: .25rem; }
.disclosure > summary {
  display: flex; align-items: center; gap: .5rem; min-height: 2.75rem;
  font-weight: 600; cursor: pointer; list-style: none; border-radius: var(--radius-s);
}
.disclosure > summary::-webkit-details-marker { display: none; }
.disclosure > summary .icon { transition: transform .15s ease; }
.disclosure[open] > summary .icon { transform: rotate(180deg); }
.disclosure__body { padding-top: .75rem; }

/* ------------------------------------------------------------------ 7. Alerts */
.alert {
  display: flex; gap: .75rem; align-items: flex-start;
  padding: .8rem 1rem;
  border: 1px solid var(--c-line); border-inline-start-width: 4px; border-radius: var(--radius-s);
  background: var(--c-surface);
}
.alert__icon { margin-top: .15rem; }
.alert__body { display: grid; gap: .35rem; min-width: 0; }
.alert__detail { font-size: var(--fs-sm); color: var(--c-ink-2); }
.alert__actions { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .25rem; }
.alert--info { border-color: var(--c-info); background: var(--c-info-soft); }
.alert--info .alert__icon { color: var(--c-info); }
.alert--ok { border-color: var(--c-ok); background: var(--c-ok-soft); }
.alert--ok .alert__icon { color: var(--c-ok); }
.alert--warn { border-color: var(--c-warn); background: var(--c-warn-soft); }
.alert--warn .alert__icon { color: var(--c-warn); }
.alert--error { border-color: var(--c-err); background: var(--c-err-soft); }
.alert--error .alert__icon { color: var(--c-err); }
.stack > * + * { margin-top: 1rem; }
.stack-gap { margin-bottom: 1rem; }

/* ------------------------------------------------------------------ 8. Login */
.login { max-width: 29rem; padding-block: clamp(1.5rem, 8vh, 5rem) 1rem; }
.letterhead--login { margin-bottom: 1.5rem; }
.letterhead--login .letterhead__name { font-size: clamp(1.5rem, 1.1rem + 1.6vw, 1.875rem); letter-spacing: .15em; padding-inline-start: .15em; }
.login__panel {
  background: var(--c-surface); border: 1px solid var(--c-line); border-radius: var(--radius-m);
  padding: clamp(1.1rem, 4vw, 1.75rem);
}
.login__panel .alert { margin-bottom: 1.25rem; }
.login__note { display: flex; gap: .5rem; margin-top: 1rem; color: var(--c-ink-2); font-size: var(--fs-sm); }
.login__note .icon { margin-top: .15rem; }
body[data-page="login"] main { display: grid; align-content: start; }

/* ------------------------------------------------------------------ 9. Generation progress */
.progress {
  margin-top: 1.5rem; padding: 1.1rem clamp(1rem, 3vw, 1.75rem) 1rem;
  background: var(--c-surface); border: 1px solid var(--c-line); border-radius: var(--radius-m);
}
.progress:focus { outline: none; }
.progress:focus-visible { outline: 3px solid var(--c-focus); outline-offset: 2px; }
.progress__status { margin-top: .35rem; color: var(--c-ink-2); font-size: var(--fs-sm); }

.stages { list-style: none; padding: 0; margin: .85rem 0 0; }
.stage {
  position: relative;
  display: grid; grid-template-columns: 1.75rem minmax(0, 1fr) auto; align-items: center; gap: .15rem .85rem;
  padding: .6rem 0;
}
.stage + .stage::before {
  content: ""; position: absolute; left: .8125rem; top: -.6rem; height: 1.2rem; width: 2px; background: var(--c-line-strong);
}
.stage__icon {
  position: relative; z-index: 1;
  display: grid; place-items: center; width: 1.75rem; height: 1.75rem;
  border: 2px solid var(--c-line-strong); border-radius: 50%; background: var(--c-surface); color: var(--c-ink-2);
}
.stage__icon .icon { width: 1rem; height: 1rem; }
.stage__label { min-width: 0; font-weight: 500; }
.stage__time { color: var(--c-ink-3); font-size: var(--fs-xs); font-variant-numeric: tabular-nums; margin-inline-start: .5rem; font-weight: 400; }
.stage__state { font-size: var(--fs-xs); font-weight: 700; color: var(--c-ink-2); text-align: right; }

.stage[data-state="done"] .stage__icon { background: var(--c-accent-bg); border-color: var(--c-accent-bg); color: var(--c-on-accent); }
.stage[data-state="running"] .stage__icon { border-color: var(--c-accent); color: var(--c-accent); }
.stage[data-state="running"] .stage__label { font-weight: 700; }
.stage[data-state="running"] .stage__state { color: var(--c-accent); }
.stage[data-state="pending"] .stage__label { color: var(--c-ink-2); font-weight: 400; }
.stage[data-state="failed"] .stage__icon { border-radius: 4px; background: var(--c-err); border-color: var(--c-err); color: #fff; }
.stage[data-state="failed"] .stage__label, .stage[data-state="failed"] .stage__state { color: var(--c-err); font-weight: 700; }
.stage[data-state="skipped"] .stage__icon { border-style: dashed; color: var(--c-ink-3); }
.stage[data-state="skipped"] .stage__label { color: var(--c-ink-3); font-weight: 400; }

.facts { display: flex; flex-wrap: wrap; gap: .35rem 1.5rem; font-size: var(--fs-sm); color: var(--c-ink-2); list-style: none; padding: 0; }
.facts strong { color: var(--c-ink); font-variant-numeric: tabular-nums; }

.mini-list { margin: .25rem 0 0; padding-inline-start: 1.2rem; font-size: var(--fs-sm); display: grid; gap: .2rem; }

/* ------------------------------------------------------------------ 13. Dialog */
.dialog {
  padding: 0; border: 1px solid var(--c-line-strong); border-radius: var(--radius-m);
  background: var(--c-surface); color: var(--c-ink);
  width: min(52rem, calc(100vw - 1.5rem)); max-height: min(88vh, 60rem);
  box-shadow: 0 24px 60px rgba(0, 0, 0, .4);
}
.dialog::backdrop { background: var(--c-backdrop); }
.dialog[open] { display: flex; flex-direction: column; }

.dialog__title { font: 700 var(--fs-base)/1.35 var(--font-ui); overflow-wrap: anywhere; }
.dialog__title:focus { outline: none; }

.dialog__foot { display: flex; justify-content: flex-end; gap: .5rem; padding: .7rem 1rem; border-top: 1px solid var(--c-line); }

.dialog__confirm { padding: 1rem; display: grid; gap: .5rem; }

/* ------------------------------------------------------------------ 14. Admin */
.admin-tabs { display: flex; flex-wrap: wrap; gap: .25rem; list-style: none; padding: 0; margin: 1rem 0 1.5rem; border-bottom: 1px solid var(--c-line-strong); }
.admin-tabs a {
  display: inline-flex; align-items: center; min-height: 2.75rem; padding: 0 1.15rem; margin-bottom: -1px;
  font: 700 var(--fs-xs)/1 var(--font-ui); letter-spacing: .09em; text-decoration: none; color: var(--c-ink-2);
  border: 1px solid transparent; border-bottom: 0; border-radius: var(--radius-s) var(--radius-s) 0 0;
}
.admin-tabs a:hover { color: var(--c-ink); background: var(--c-surface-2); }
.admin-tabs a[aria-current="page"] { background: var(--c-desk); color: var(--c-ink); border-color: var(--c-line-strong); box-shadow: inset 0 3px 0 var(--c-accent-bg); border-bottom: 1px solid var(--c-desk); }

/* Kutular sütunlara dengeli dağılır (yüksekliği farklı kutularda boş hücre kalmaz). */
.sys-grid { column-width: 22rem; column-gap: 1rem; }
.sys-grid > .box { break-inside: avoid; margin-bottom: 1rem; }
.box { background: var(--c-surface); border: 1px solid var(--c-line); border-radius: var(--radius-m); padding: 1rem 1.25rem 1.1rem; }
.box__title { font: 700 var(--fs-xs)/1.3 var(--font-ui); letter-spacing: .09em; margin-bottom: .8rem; }
.kv { display: grid; grid-template-columns: minmax(7.5rem, 42%) minmax(0, 1fr); gap: .5rem 1rem; font-size: var(--fs-sm); }
.kv dt { color: var(--c-ink-2); }
.kv dd { font-weight: 600; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.kv dd .small { font-weight: 400; color: var(--c-ink-2); display: block; }
.kv .badge { white-space: normal; text-align: left; }
.kv--compact { margin-top: .75rem; }

.badge { display: inline-flex; align-items: center; gap: .35rem; padding: .1rem .5rem .1rem .4rem; border: 1px solid var(--c-line-strong); border-radius: var(--radius-s); font-size: var(--fs-xs); font-weight: 700; background: var(--c-surface-2); color: var(--c-ink); white-space: nowrap; }
.badge .icon { width: .95rem; height: .95rem; }
.badge--ok { border-color: var(--c-ok); background: var(--c-ok-soft); color: var(--c-ok); }
.badge--warn { border-color: var(--c-warn); background: var(--c-warn-soft); color: var(--c-warn); }
.badge--err { border-color: var(--c-err); background: var(--c-err-soft); color: var(--c-err); }
.badge--info { border-color: var(--c-info); background: var(--c-info-soft); color: var(--c-info); }
.badge--muted { color: var(--c-ink-2); }

/* Admin → Sistem → ÜRETİM MOTORU */
.engine-line { margin-bottom: .35rem; font-weight: 700; }
.box__subtitle { margin: 1rem 0 .1rem; font: 700 var(--fs-xs)/1.3 var(--font-ui); letter-spacing: .06em; color: var(--c-ink-2); }
.box__lead code { font-size: .92em; overflow-wrap: anywhere; }
#engine-privacy-admin { display: flex; gap: .5rem; align-items: flex-start; margin: 0 0 .85rem; }

.health { list-style: none; padding: 0; display: grid; gap: .5rem; font-size: var(--fs-sm); }
.health li { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }

.toolbar { display: flex; flex-wrap: wrap; align-items: flex-end; gap: .75rem 1rem; margin-bottom: 1rem; }
.toolbar .field { margin: 0; }
.toolbar__grow { flex: 1 1 16rem; }
.toolbar__spacer { flex: 1 1 auto; }
.search-box { position: relative; }
.search-box .icon { position: absolute; left: .75rem; top: 50%; transform: translateY(-50%); color: var(--c-ink-3); pointer-events: none; }
.search-box .control { padding-inline-start: 2.4rem; }

/* position: relative -> .visually-hidden (absolute) çocukları kaydırma alanı içinde kırpılır, sayfayı yatayda genişletmez */
.table-scroll { position: relative; overflow-x: auto; background: var(--c-surface); border: 1px solid var(--c-line); border-radius: var(--radius-m); }
.table-scroll:focus-visible { outline-offset: 0; }
.data-table { width: 100%; min-width: 58rem; border-collapse: collapse; font-size: var(--fs-sm); }
.data-table caption { text-align: left; }
.data-table th { padding: .65rem .8rem; text-align: left; white-space: nowrap; font: 700 var(--fs-xs)/1.3 var(--font-ui); letter-spacing: .03em; background: var(--c-surface-2); border-bottom: 1px solid var(--c-line-strong); }
.data-table td { padding: .65rem .8rem; border-bottom: 1px solid var(--c-line); vertical-align: top; }
.data-table tbody th { padding: .65rem .8rem; border-bottom: 1px solid var(--c-line); background: var(--c-surface); vertical-align: top; letter-spacing: 0; white-space: normal; font: 600 var(--fs-sm)/1.5 var(--font-ui); }
/* Dosya adı sütunu dar ekranda yatay kaydırma sırasında görünür kalır. */
.data-table .cell-file, .data-table thead th:first-child { position: sticky; left: 0; z-index: 1; }
.data-table thead th:first-child { z-index: 2; }
.data-table tbody th.cell-file { min-width: 16rem; box-shadow: 1px 0 0 var(--c-line); }
.data-table tbody tr:last-child th { border-bottom: 0; }
.data-table .cell-origin { white-space: nowrap; }
.data-table tbody tr:last-child td { border-bottom: 0; }
.data-table .cell-file { max-width: 24rem; overflow-wrap: anywhere; font-weight: 600; }
.data-table .cell-note { display: block; margin-top: .2rem; font-weight: 400; font-size: var(--fs-xs); color: var(--c-ink-2); }
.data-table .cell-date { white-space: nowrap; font-variant-numeric: tabular-nums; }
.data-table .cell-empty { padding: 2rem 1rem; text-align: center; color: var(--c-ink-2); }
.pagination { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; margin-top: .85rem; font-size: var(--fs-sm); color: var(--c-ink-2); }
.pagination__info { font-variant-numeric: tabular-nums; }
.pagination__spacer { flex: 1 1 auto; }

.admin-actions { display: grid; gap: 1rem; margin-top: 1.75rem; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 62.5em) { .admin-actions { grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); align-items: start; } }
.box__lead { margin-bottom: .85rem; color: var(--c-ink-2); font-size: var(--fs-sm); }
.kv + .box__lead { margin: .85rem 0 0; }
.upload-row { display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; }
.upload-row input[type="file"] { flex: 1 1 16rem; min-width: 0; padding: .45rem; font-size: var(--fs-sm); }
.upload-result { margin-top: .85rem; }

/* Tek sütunlu ızgara kapsayıcılarında iç içeriğin (ör. kaydırılabilir tablo) sütunu genişletmesini engeller. */
.field, .alert__body, .blocks, .dialog__confirm, .app-footer__inner { grid-template-columns: minmax(0, 1fr); }

/* ------------------------------------------------------------------ 15. Responsive tweaks */
@media (max-width: 39.99em) {
  main { padding-block: 1rem 2rem; }
  /* Uzun düğme etiketleri (ör. İNDEKS DURUMUNU KONTROL ET) 320 px genişlikte taşmak yerine satıra bölünür. */
  .btn { white-space: normal; text-align: center; }
  .app-header__inner { gap: .35rem 1rem; }
  .compose__actions .btn--lg { width: 100%; }
  .stage { grid-template-columns: 1.75rem minmax(0, 1fr); }
  .stage__state { grid-column: 2; text-align: left; }
  .kv { grid-template-columns: minmax(0, 1fr); gap: .1rem 0; }
  .kv dd { margin-bottom: .5rem; }
}

/* ------------------------------------------------------------------ 16. Motion, contrast, print */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
  .icon--spin { animation: none; }
}

@media (forced-colors: active) {
  .btn, .control { border: 1px solid ButtonText; }
  .stage[data-state="done"] .stage__icon { background: Highlight; color: HighlightText; }
}

@media print {
  @page { size: A4; margin: 2.5cm; }
  html, body { background: #fff !important; color: #000 !important; }
  body { display: block; }
  main { padding: 0; }
  .wrap { width: auto; margin: 0; }
  .app-header, .app-footer, .skip-link, .letterhead, .compose, .progress, dialog, #run-error, .alert, .sprite { display: none !important; }
  mark { background: none; color: #000; text-decoration: underline; }
}

/* ------------------------------------------------------------------ FAZ 5E. Main page (tabs, wide compose card, "Üretim Modu"), three clean text cards */
/* The compose card and its tabs use the same width: >= 70 vw up to 1500 px; the full container below ~1100 px. */
.tabs, .tabpanel { --compose-width: min(100%, max(72vw, 44rem), 1500px); width: var(--compose-width); margin-inline: auto; }
@media (max-width: 68.75em) { .tabs, .tabpanel { --compose-width: 100%; } }
.tabs { display: flex; flex-wrap: wrap; gap: .25rem; border-bottom: 1px solid var(--c-line-strong); }
.tab {
  min-height: 2.75rem; padding: 0 1.25rem; margin-bottom: -1px;
  border: 1px solid transparent; border-bottom: 0; border-radius: var(--radius-s) var(--radius-s) 0 0;
  background: transparent; color: var(--c-ink-2); cursor: pointer;
  font: 700 var(--fs-sm)/1 var(--font-ui); letter-spacing: .06em;
}
.tab:hover { color: var(--c-ink); background: var(--c-surface-2); }
.tab[aria-selected="true"] { background: var(--c-surface); color: var(--c-ink); border-color: var(--c-line-strong); border-bottom: 1px solid var(--c-surface); box-shadow: inset 0 3px 0 var(--c-accent-bg); }
.tabpanel { padding-top: 1rem; }
.tabpanel .compose { width: 100%; }
.compose-status { margin-top: 1rem; }
.compose-status .progress { margin-top: 0; }
.control--request { min-height: calc(7 * 1.55em + 1.3rem); }

.engine-field { min-width: 0; margin: 0 0 1.25rem; padding: 0; border: 0; }
.engine-field__legend { padding: 0; margin-bottom: .5rem; font: 700 var(--fs-xs)/1.3 var(--font-ui); letter-spacing: .09em; color: var(--c-ink); }
.engine-cards { display: grid; gap: .75rem; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 40em) { .engine-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.engine-card {
  position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr); align-content: start; column-gap: .65rem; row-gap: .2rem;
  padding: .85rem 1rem; border: 1px solid var(--c-line-strong); border-radius: var(--radius-s); background: var(--c-field);
}
.engine-card:hover { border-color: var(--c-ink-2); }
.engine-card__input { grid-column: 1; grid-row: 1; width: 1.1rem; height: 1.1rem; margin: .15rem 0 0; accent-color: var(--c-accent-bg); }
.engine-card__label { grid-column: 2; grid-row: 1; font-weight: 700; cursor: pointer; }
.engine-card__label::after { content: ""; position: absolute; inset: 0; }                  /* the whole card is the click target of its radio */
.engine-card__hint, .engine-card__admin, .engine-card__note { grid-column: 2; margin: 0; font-size: var(--fs-sm); color: var(--c-ink-2); }
.engine-card__admin { font-weight: 600; color: var(--c-ink); }
.engine-card__note { font-weight: 600; color: var(--c-ink); }
.engine-card:has(.engine-card__input:checked) { border-color: var(--c-accent-bg); background: var(--c-accent-soft); box-shadow: inset 3px 0 0 var(--c-accent-bg); }
.engine-card:has(.engine-card__input:focus-visible) { outline: 3px solid var(--c-focus); outline-offset: 2px; }
.engine-card.is-disabled { background: var(--c-surface-2); border-style: dashed; }
.engine-card.is-disabled .engine-card__label { color: var(--c-ink-2); cursor: not-allowed; }
.engine-card.is-disabled .engine-card__hint { color: var(--c-ink-3); }

.progress__status { display: flex; align-items: center; gap: .6rem; margin: 0; color: var(--c-ink); font-size: var(--fs-base); font-weight: 600; }
.progress__status .icon { color: var(--c-accent); }
.progress-wrap { width: 100%; max-width: var(--measure); margin-inline: auto; }

/* Result page: a slim bar, then three equal text cards side by side (>= 1400 px viewport), 2 + 1 (>= 784 px), 1 column below. */
.set-result { display: grid; gap: 1.25rem; margin-top: .5rem; min-width: 0; }
.set-toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem 1rem; }
.set-toolbar__info { display: flex; flex-wrap: wrap; align-items: baseline; gap: .25rem 1rem; min-width: 0; }
.set-toolbar__mode { margin: 0; font-size: var(--fs-sm); font-weight: 700; color: var(--c-ink); }
.set-toolbar__fallback { margin: 0; color: var(--c-ink-2); font-size: var(--fs-sm); }
.drafts { display: grid; gap: 1.5rem; grid-template-columns: minmax(0, 1fr); align-items: stretch; }
@media (min-width: 49em) { .drafts { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 87.5em) { .drafts { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.drafts.drafts--single { grid-template-columns: minmax(0, 56rem); justify-content: center; }

/* The card is a sheet of paper (light in both colour themes, like the Word file): its own controls use the paper tokens. */
.draft-card {
  --c-ink: var(--p-ink); --c-ink-2: var(--p-ink-2); --c-ink-3: var(--p-ink-3); --c-line: var(--p-line); --c-line-strong: var(--p-line-strong);
  --c-surface: var(--p-paper); --c-surface-2: var(--p-surface-2); --c-field: var(--p-paper); --c-focus: var(--p-focus);
  color-scheme: light;
  min-width: 0; display: flex; flex-direction: column; gap: .85rem;
  padding: clamp(.9rem, 2.2vw, 1.5rem); background: var(--p-paper); color: var(--p-ink);
  border: 1px solid var(--p-line); border-radius: var(--radius-m);
}
.draft-card__head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .5rem .75rem; padding-bottom: .75rem; border-bottom: 1px solid var(--p-line); }
.draft-card__title { font: 700 var(--fs-base)/1.3 var(--font-ui); letter-spacing: .09em; }
.draft-card__title:focus { outline: none; }
.draft-card__title:focus-visible { outline: 3px solid var(--p-focus); outline-offset: 4px; }
.draft-card__actions { display: flex; flex-wrap: wrap; gap: .5rem; }
.draft-card .btn { background: var(--p-paper); border-color: var(--p-line-strong); color: var(--p-ink); }
.draft-card .btn:hover { background: var(--p-surface-2); }
.draft-card .btn--primary { background: var(--c-accent-bg); border-color: var(--c-accent-bg); color: var(--c-on-accent); }
.draft-card .btn--primary:hover { background: var(--c-accent-bg-hover); border-color: var(--c-accent-bg-hover); }
.draft-card .btn[data-state="copied"] { border-color: var(--p-accent); color: var(--p-accent); }
.draft-card__note { display: grid; gap: .5rem; padding: .6rem .8rem; border: 1px solid var(--p-line-strong); border-inline-start: 4px solid var(--p-mark-edge); border-radius: var(--radius-s); background: var(--p-tint); color: var(--p-ink); font-size: var(--fs-sm); }
.draft-card__note-text { margin: 0; font-weight: 600; }
.draft-card__note-actions { display: flex; flex-wrap: wrap; gap: .5rem; }
.draft-card__fallback { display: grid; gap: .4rem; }
.draft-card .control { background: var(--p-paper); color: var(--p-ink); border-color: var(--p-line-strong); }

/* The text itself: real paragraphs, 17 px, no inner scroll bar (the page grows with the text). */
.draft-text { flex: 1 1 auto; min-width: 0; overflow: visible; font: 400 1.0625rem/1.65 var(--font-ui); color: var(--p-ink); overflow-wrap: break-word; }
.draft-text p { margin: 0 0 .9em; padding: .1rem .2rem; border-radius: var(--radius-s); white-space: pre-wrap; text-align: left; }
.draft-text p:last-child { margin-bottom: 0; }
.draft-text p:empty { min-height: 1.65em; }
.draft-text p[data-kind="title"] { text-align: center; font-weight: 700; font-size: 1.1em; }
.draft-text p[data-kind="subject"], .draft-text p[data-role="heading"], .draft-text p[data-role="label"], .draft-text p[data-bold="true"] { font-weight: 700; }
.draft-text p[data-role="signature"], .draft-text p[data-align="right"] { text-align: right; }
.draft-text p[data-align="center"] { text-align: center; }
.draft-text p[data-role="note"] { font-style: italic; color: var(--p-ink-2); }
.draft-text p[data-role="list_item"] { padding-inline-start: 1.4rem; }
.draft-text p:focus-visible, .draft-text td:focus-visible, .draft-text th:focus-visible, .draft-text caption:focus-visible { outline: 2px solid var(--p-focus); outline-offset: 2px; }
.draft-table { width: 100%; margin: 0 0 .9em; border-collapse: collapse; table-layout: fixed; font-size: .9375em; }
.draft-table caption { padding-bottom: .35rem; text-align: left; font-weight: 700; }
.draft-table th, .draft-table td { padding: .35rem .5rem; border: 1px solid var(--p-line-strong); vertical-align: top; text-align: left; white-space: pre-wrap; overflow-wrap: anywhere; }
.draft-table th { background: var(--p-tint); font-weight: 700; }

.set-sources { max-width: 60rem; }
.set-sources__lead { margin: 0 0 .75rem; }
.set-sources__group + .set-sources__group { margin-top: .75rem; }

@media print {
  .tabs, .engine-field, .set-toolbar, .set-sources, .draft-card__head, .draft-card__note { display: none !important; }
  .drafts { display: block; }
  .draft-card { break-after: page; border: 0; padding: 0; }
}

/* ------------------------------------------------------------------ FAZ 5D. Admin: dört sayfa (Genel Durum, Bilgi Kaynakları, Yapay Zeka Ayarları, Sistem / Sağlık) */
/* Sekme çubuğu: dar ekranda 2 x 2 hücre (yatay kaydırma yok, her sekme tam görünür). */
.admin-nav { min-width: 0; }
@media (max-width: 39.99em) {
  .admin-tabs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .35rem; border-bottom: 0; margin-bottom: 1.1rem; }
  .admin-tabs a { width: 100%; min-height: 2.75rem; padding: .35rem .6rem; margin-bottom: 0; justify-content: center; text-align: center; line-height: 1.25;
                  border: 1px solid var(--c-line); border-radius: var(--radius-s); background: var(--c-surface); }
  .admin-tabs a[aria-current="page"] { border-color: var(--c-line-strong); background: var(--c-surface); box-shadow: inset 0 3px 0 var(--c-accent-bg); }
}

/* Durum kartı (Genel Durum ve Yapay Zeka Ayarları) */
.status-card { display: grid; gap: .75rem; }
.status-card .kv { margin-top: .25rem; }
.status-card__fallback { display: flex; gap: .5rem; align-items: flex-start; margin: 0; }
.status-card__fallback[hidden] { display: none; }

/* Genel Durum: bölümlere giden bağlantılar */
.overview-links { margin-top: 1rem; }
.link-cards { list-style: none; padding: 0; display: grid; gap: 1rem; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 48em) { .link-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.link-card { display: grid; gap: .6rem; align-content: start; padding: 1rem; border: 1px solid var(--c-line); border-radius: var(--radius-m); background: var(--c-surface-2); }
.link-card--primary { border-color: var(--c-accent-bg); background: var(--c-accent-soft); }
.link-card .btn { justify-self: start; max-width: 100%; }
.link-card p { color: var(--c-ink-2); font-size: var(--fs-sm); }

/* Yapay Zeka Ayarları sayfası */
.ai-page { max-width: 52rem; display: grid; gap: 1rem; min-width: 0; }
.ai-page__head { display: grid; gap: .4rem; }
.ai-page__title { font: 700 var(--fs-lg)/1.25 var(--font-ui); }
.ai-page__title:focus { outline: none; }
.ai-page__title:focus-visible { outline: 3px solid var(--c-focus); outline-offset: 4px; }
.ai-page__subtitle { color: var(--c-ink-2); max-width: var(--measure); }
.ai-card { background: var(--c-surface); border: 1px solid var(--c-line); border-radius: var(--radius-m); padding: clamp(1rem, 3vw, 1.5rem); min-width: 0; }
.ai-form { display: grid; gap: 1.25rem; align-content: start; }
.ai-form__group { border: 0; padding: 0; margin: 0; min-width: 0; }
.ai-form__group + .ai-form__group, .ai-form__group + .disclosure { padding-top: 1.25rem; border-top: 1px solid var(--c-line); }
.ai-form__legend { padding: 0; margin: 0 0 .5rem; font: 700 var(--fs-xs)/1.3 var(--font-ui); letter-spacing: .09em; color: var(--c-ink); }
.ai-form__radios { display: grid; gap: .5rem; grid-template-columns: minmax(0, 1fr); margin: .6rem 0 .25rem; }
@media (min-width: 48em) { .ai-form__radios { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.choice { display: inline-flex; align-items: center; gap: .5rem; min-height: 2.25rem; cursor: pointer; }
.choice input { width: 1.1rem; height: 1.1rem; flex: none; accent-color: var(--c-accent-bg); }
.choice--card { padding: .55rem .8rem; border: 1px solid var(--c-line-strong); border-radius: var(--radius-s); background: var(--c-field); font-weight: 600; font-size: var(--fs-sm); }
.choice--card:hover { border-color: var(--c-ink-2); }
.choice--card:has(input:checked) { border-color: var(--c-accent-bg); background: var(--c-accent-soft); box-shadow: inset 3px 0 0 var(--c-accent-bg); }
.choice--card:has(input:disabled) { opacity: .55; cursor: not-allowed; }
.choice--card:has(input:focus-visible) { outline: 3px solid var(--c-focus); outline-offset: 2px; }
.ai-form .alert { margin-top: .75rem; }
.input-row { display: flex; flex-wrap: wrap; gap: .5rem; align-items: stretch; }
.input-row .control { flex: 1 1 14rem; min-width: 0; }
.input-row .btn { flex: none; }
.chip { display: inline-block; padding: .05rem .5rem; border: 1px solid var(--c-line-strong); border-radius: var(--radius-s); background: var(--c-accent-soft); color: var(--c-ink); font: 600 var(--fs-xs)/1.5 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; overflow-wrap: anywhere; }
.key-line { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem .6rem; font-weight: 600; font-size: var(--fs-sm); }
.ai-form__official { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem .6rem; margin: -.5rem 0 1.25rem; }
.ai-form__picker { display: grid; gap: .3rem; margin-top: .25rem; }
.ai-form__inline { min-height: 1.25rem; margin: 0; font-size: var(--fs-sm); font-weight: 600; color: var(--c-ink-2); }
.ai-form__inline[data-tone="error"] { color: var(--c-err); }
.ai-form__inline[data-tone="ok"] { color: var(--c-ok); }
.ai-form__row { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .25rem; }
.ai-form__actions { margin-top: .25rem; }
.ai-form__message { min-height: 1.5rem; margin: 0; font-weight: 600; color: var(--c-ink-2); }
.ai-form__message[data-tone="error"] { color: var(--c-err); }
.ai-form__message[data-tone="ok"] { color: var(--c-ok); }
.ai-form__last { margin-top: 0; }
.ai-mark { display: inline-block; margin-inline-end: .4rem; font-weight: 700; }
.ai-mark--ok { color: var(--c-ok); }
.ai-mark--err { color: var(--c-err); }

/* Hızlı Test: üç taslak, salt okunur önizleme */
.qt-result { display: grid; gap: .6rem; margin-top: .75rem; }
.qt-result .alert { margin: 0; }
.qt-drafts { display: grid; gap: 1rem; grid-template-columns: minmax(0, 1fr); align-items: start; }
@media (min-width: 62.5em) { .qt-drafts { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.qt-draft { display: grid; gap: .4rem; align-content: start; min-width: 0; padding: .85rem 1rem; border: 1px solid var(--c-line); border-radius: var(--radius-m); background: var(--c-surface-2); }
.qt-draft__heading { font: 700 var(--fs-xs)/1.3 var(--font-ui); letter-spacing: .09em; }
.qt-draft__title { font-weight: 700; font-size: var(--fs-sm); overflow-wrap: anywhere; }
.qt-draft__text { max-height: 24rem; overflow: auto; padding: .6rem .75rem; border: 1px solid var(--c-line); border-radius: var(--radius-s); background: var(--c-surface); font-size: var(--fs-sm); line-height: 1.55; overflow-wrap: anywhere; }
.qt-draft__text p { white-space: pre-wrap; }
.qt-draft__text p + p { margin-top: .6rem; }
.qt-draft__text:focus-visible { outline-offset: 0; }