/* ==========================================================================
   FYY tasarım sistemi — fyy.css (iç ekip, müşteri ve giriş ekranları)
   Runner/Wise tasarım dili ("00 Tasarım Sistemi"): mürekkep petrolü metin,
   serin kâğıt zemin, deniz mavisi birincil eylem, küçük köşeler, yoğun tablolar.
   Kaynak: /runner/web/styles/tokens.css :root ve gövde taban stili (birebir),
   Wise "Taslak Tasarımlar" layout.css + components.css (kabuk ve bileşenler).
   Yalnızca açık tema (Wise ile aynı). Harici font/CDN yok (CSP); inline betik yok.
   Bileşenler çoğunlukla öğe düzeyinde (.icerik içinde) uygulanır; böylece
   sınıfsız sayfa şablonları da kabuğu miras alır.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Yazı tipleri — yerel woff2 (SIL OFL 1.1, bkz. yazi-tipleri/OFL.txt).
   Bricolage Grotesque ve IBM Plex Sans değişken (tek dosya tüm kalınlıklar);
   IBM Plex Mono kalınlık başına ayrı dosya. Türkçe için latin + latin-ext.
   -------------------------------------------------------------------------- */
@font-face {
  font-family: 'Bricolage Grotesque'; font-style: normal; font-weight: 600 700; font-display: swap;
  src: url("yazi-tipleri/bricolage-grotesque-latin-ext.deca0e4e8d0e.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Bricolage Grotesque'; font-style: normal; font-weight: 600 700; font-display: swap;
  src: url("yazi-tipleri/bricolage-grotesque-latin.b7df97614c8e.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'IBM Plex Sans'; font-style: normal; font-weight: 400 700; font-display: swap;
  src: url("yazi-tipleri/ibm-plex-sans-latin-ext.d313794bd9fd.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'IBM Plex Sans'; font-style: normal; font-weight: 400 700; font-display: swap;
  src: url("yazi-tipleri/ibm-plex-sans-latin.d28498895ed7.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'IBM Plex Mono'; font-style: normal; font-weight: 400; font-display: swap;
  src: url("yazi-tipleri/ibm-plex-mono-400-latin-ext.17a5b2a15bf5.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'IBM Plex Mono'; font-style: normal; font-weight: 400; font-display: swap;
  src: url("yazi-tipleri/ibm-plex-mono-400-latin.814fe1615d4d.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'IBM Plex Mono'; font-style: normal; font-weight: 500; font-display: swap;
  src: url("yazi-tipleri/ibm-plex-mono-500-latin-ext.216ee1a35b06.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'IBM Plex Mono'; font-style: normal; font-weight: 500; font-display: swap;
  src: url("yazi-tipleri/ibm-plex-mono-500-latin.6708425c446b.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'IBM Plex Mono'; font-style: normal; font-weight: 600; font-display: swap;
  src: url("yazi-tipleri/ibm-plex-mono-600-latin-ext.6041b3192dc3.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'IBM Plex Mono'; font-style: normal; font-weight: 600; font-display: swap;
  src: url("yazi-tipleri/ibm-plex-mono-600-latin.e71a597e376e.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* --------------------------------------------------------------------------
   Tokenlar — Runner tokens.css :root bloğu, ad ve değerler BİREBİR.
   Burada değişiklik yapılmaz; önce Runner'da değişir, sonra buraya yansır.
   -------------------------------------------------------------------------- */
:root {
  /* --- Renk --- */
  --murekkep:      #0D2E3F;   /* mürekkep petrolü — başlık ve ana metin */
  --murekkep-2:    #3D5F70;   /* ikincil metin */
  --murekkep-3:    #6E8B98;   /* üçüncül / etiket */
  --kagit:         #EFF6F6;   /* serin kâğıt zemini */
  --kagit-2:       #F7FBFB;   /* açık kâğıt (satır zebra) */
  --yuzey:         #FFFFFF;
  --cizgi:         #D7E6E8;   /* defter cetveli */
  --cizgi-koyu:    #B9D2D6;

  --deniz:         #0E7C9B;   /* birincil eylem — teal-mavi */
  --deniz-koyu:    #0A5F78;
  --deniz-sis:     #E4F2F6;   /* birincil tonlu zemin */

  --yesil:         #12916C;   /* tamamlandı / yolunda */
  --yesil-sis:     #E2F4EE;
  --kehribar:      #B87309;   /* hareketsiz / uyarı */
  --kehribar-sis:  #FBF0DC;
  --mercan:        #C0413B;   /* acil / risk / gecikme */
  --mercan-sis:    #FBE9E7;
  --mor:           #6A5AA8;   /* askıda */
  --mor-sis:       #EEEBF7;

  /* --- Tipografi --- */
  --f-baslik: 'Bricolage Grotesque', 'IBM Plex Sans', system-ui, sans-serif;
  --f-govde:  'IBM Plex Sans', system-ui, -apple-system, sans-serif;
  --f-mono:   'IBM Plex Mono', ui-monospace, 'SF Mono', monospace;

  --ts-mikro:  11px;
  --ts-kucuk:  12px;
  --ts-govde:  13.5px;
  --ts-orta:   15px;
  --ts-buyuk:  19px;
  --ts-baslik: 26px;
  --ts-dev:    54px;   /* geri sayım — bilinçli iri */

  /* --- Ölçü --- */
  --r: 5px;            /* köşe — bilinçli küçük, "kâğıt" hissi */
  --r-buyuk: 8px;

  /* --- Boşluk ölçeği (8px tabanlı, üstü bilerek sıkıştırılmış) --- */
  --b1: 2px;   /* kıl payı — rozet içi, satır arası */
  --b2: 4px;
  --b3: 6px;
  --b4: 8px;   /* TABAN birim */
  --b5: 10px;
  --b6: 12px;
  --b7: 16px;
  --b8: 20px;  /* en geniş — bölüm arası */

  /* --- Yoğunluk (WCAG 2.5.8 tabanı --btn-k-y = 24px) --- */
  --rail-en:   200px;
  --satir-y:   34px;
  --topbar-y:  46px;
  --btn-y:     28px;
  --btn-k-y:   24px;
  --cip-y:     26px;
  --golge: 0 1px 2px rgba(13, 46, 63, .06), 0 4px 14px rgba(13, 46, 63, .05);
  --golge-yuksek: 0 8px 30px rgba(13, 46, 63, .14);
  --gecis: 140ms cubic-bezier(.2, .7, .4, 1);

  /* ======================================================================
     Wise ekleri (Wise tokens.css "Wise'a özgü ekler" bloğundan birebir).
     ====================================================================== */
  --r-yuvarlak: 9999px;
  --golge-orta: 0 4px 12px rgba(13, 46, 63, 0.08);
  --golge-buyuk: 0 12px 28px rgba(13, 46, 63, 0.12);
  --icerik-maks-en: 1560px;

  /* ======================================================================
     FYY'ye özgü ekler — Runner/Wise tokens.css'te BULUNMAZ.
     Yukarıdaki adlar/değerler değiştirilmez; FYY ihtiyaçları yalnız burada.
     ====================================================================== */
  --fyy-alan-y: 34px;        /* form alanı yüksekliği (Wise .form-alan ~38px; yoğunluk için satir-y) */
  --fyy-dokunma: 44px;       /* müşteri ekranı ve dar ekranda asgari dokunma hedefi */
  --fyy-form-en: 40rem;      /* tek formlu sayfalarda kart genişliği */
  --fyy-giris-en: 440px;     /* giriş kartı (Wise .kimlik-kart) */
  --fyy-mercan-koyu: #A0342F;  /* tehlike düğmesi üzeri (Wise .btn-tehlike:hover) */
  --fyy-bant-uyari: #784803;   /* bant metinleri (Wise .bant-*) */
  --fyy-bant-hata: #832723;
  --fyy-bant-basari: #0B634A;
}

/* --------------------------------------------------------------------------
   Gövde taban stili (Runner tokens.css'ten birebir)
   -------------------------------------------------------------------------- */
* { box-sizing: border-box; }
*::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; overflow-x: clip; }

body {
  margin: 0;
  overflow-x: clip;
  background: var(--kagit);
  color: var(--murekkep);
  font-family: var(--f-govde);
  font-size: var(--ts-govde);
  line-height: 1.5;
  font-feature-settings: "cv05" 1;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4 { font-family: var(--f-baslik); font-weight: 600; letter-spacing: -.015em; margin: 0; }
a { color: var(--deniz); text-decoration: none; }
a:hover { text-decoration: underline; text-underline-offset: 2px; }
:focus-visible { outline: 2px solid var(--deniz); outline-offset: 2px; border-radius: 3px; }
button, input, select, textarea { font-family: inherit; }

.atla {
  position: absolute; left: var(--b4); top: -60px; z-index: 300;
  padding: var(--b4) var(--b6); background: var(--yuzey); color: var(--murekkep);
  border: 1px solid var(--cizgi); border-radius: var(--r); box-shadow: var(--golge-orta);
}
.atla:focus { top: var(--b4); }

/* Marka işareti (Wise .rail-logo-isaret / .kimlik-logo) */
.marka { display: flex; align-items: center; gap: var(--b4); color: var(--murekkep); text-decoration: none; }
.marka:hover { text-decoration: none; }
.marka-isaret {
  display: inline-flex; align-items: center; justify-content: center; flex: none;
  width: 26px; height: 26px;
  background: var(--deniz); color: #FFFFFF;
  font-family: var(--f-baslik); font-size: 16px; font-weight: 700; line-height: 1;
  border-radius: var(--r);
}
.marka-yazi { display: flex; flex-direction: column; min-width: 0; }
.marka-ad { font-family: var(--f-baslik); font-size: var(--ts-orta); font-weight: 700; line-height: 1.1; color: var(--murekkep); }
.kurum { font-size: var(--ts-mikro); font-weight: 500; color: var(--murekkep-3); }

/* ==========================================================================
   Kabuk — sol ray (200px) + üst bar (46px) + içerik (Wise layout.css)
   ========================================================================== */
.kabuk { display: flex; min-height: 100vh; background: var(--kagit); }

.rail {
  width: var(--rail-en); min-width: var(--rail-en);
  background: var(--yuzey);
  border-right: 1px solid var(--cizgi);
  display: flex; flex-direction: column;
  position: sticky; top: 0; height: 100vh;
  z-index: 100;
}
.rail-logo {
  height: var(--topbar-y); flex: none;
  padding: var(--b5) var(--b6);
  border-bottom: 1px solid var(--cizgi);
}
.yan-menu { flex: 1; overflow-y: auto; padding: var(--b4) 0; }

.menu-liste { list-style: none; margin: 0; padding: 0; }
.menu-liste + .menu-liste { margin-top: var(--b6); padding-top: var(--b6); border-top: 1px solid var(--cizgi); }
.menu-liste a {
  display: flex; align-items: center;
  min-height: 30px; padding: var(--b3) var(--b6);
  color: var(--murekkep-2); text-decoration: none;
  font-size: var(--ts-govde); font-weight: 500;
  border-left: 2px solid transparent;
  transition: background-color var(--gecis), color var(--gecis);
}
.menu-liste a:hover { background: var(--kagit-2); color: var(--deniz); text-decoration: none; }
.menu-liste a[aria-current] {
  background: var(--deniz-sis); color: var(--deniz-koyu);
  border-left-color: var(--deniz); font-weight: 600;
}
.menu-liste a:focus-visible { outline-offset: -2px; }
.menu-liste .alt a { padding-left: calc(var(--b6) + var(--b7)); font-size: var(--ts-kucuk); }

.ana-alan { flex: 1; display: flex; flex-direction: column; min-width: 0; }

.ust-bar {
  height: var(--topbar-y); flex: none;
  display: flex; align-items: center; gap: var(--b6);
  padding: 0 var(--b7);
  background: var(--yuzey);
  border-bottom: 1px solid var(--cizgi);
  position: sticky; top: 0; z-index: 90;
}
.ust-marka { display: none; flex: none; }
.kabuk-tek .ust-marka { display: flex; }
.ust-iz { flex: 1; min-width: 0; }

/* Konum izi (Wise .topbar-iz) */
.yol { font-size: var(--ts-govde); color: var(--murekkep-3); min-width: 0; }
.yol ol { list-style: none; display: flex; align-items: center; gap: var(--b3); margin: 0; padding: 0; white-space: nowrap; min-width: 0; }
.yol li { flex: none; }
.yol li:last-child { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.yol li + li::before { content: "/"; margin-right: var(--b3); color: var(--cizgi-koyu); }
.yol a { color: var(--murekkep-2); }
.yol a:hover { color: var(--deniz); }
.yol li:last-child a, .yol [aria-current] { color: var(--murekkep); font-weight: 600; }

.kullanici { margin-left: auto; display: flex; align-items: center; gap: var(--b5); flex: none; font-size: var(--ts-kucuk); }
.kullanici-ad { font-weight: 600; color: var(--murekkep); }
.kullanici-rol {
  display: inline-flex; align-items: center;
  padding: var(--b1) var(--b4);
  background: var(--kagit); border: 1px solid var(--cizgi-koyu); border-radius: var(--r-yuvarlak);
  font-size: var(--ts-mikro); font-weight: 600; color: var(--murekkep-2); white-space: nowrap;
}
.kullanici form { margin: 0; }
.ust-cikis {
  display: inline-flex; align-items: center; height: var(--btn-y); padding: 0 var(--b5);
  font: inherit; font-size: var(--ts-kucuk); font-weight: 500; color: var(--murekkep-2);
  background: transparent; border: 1px solid transparent; border-radius: var(--r);
  cursor: pointer; transition: background-color var(--gecis), color var(--gecis);
}
.ust-cikis:hover { background: var(--cizgi); color: var(--murekkep); }

.mobil-menu { display: none; }

.icerik {
  flex: 1; width: 100%;
  max-width: var(--icerik-maks-en);
  padding: var(--b7) var(--b8) var(--b8);
}

/* ==========================================================================
   Tipografi ve sayfa başı (Wise components.css)
   ========================================================================== */
.icerik h1 {
  margin: 0 0 var(--b6);
  font-size: var(--ts-baslik); font-weight: 700; line-height: 1.2;
  letter-spacing: -.02em; color: var(--murekkep);
}
.icerik h2 {
  margin: var(--b8) 0 var(--b5);
  font-size: var(--ts-buyuk); font-weight: 600; line-height: 1.25; color: var(--murekkep);
}
.icerik h3 {
  margin: var(--b7) 0 var(--b4);
  font-family: var(--f-govde); font-size: var(--ts-orta); font-weight: 600; letter-spacing: 0; color: var(--murekkep);
}
.icerik p { max-width: 80ch; margin: 0 0 var(--b6); }
.icerik small { color: var(--murekkep-3); font-size: var(--ts-kucuk); }
.icerik strong { font-weight: 600; }

.sayfa-bas { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: var(--b6); margin-bottom: var(--b7); }
.sayfa-bas h1 { margin-bottom: var(--b2); }
.alt-baslik { margin: 0; color: var(--murekkep-2); }
.ikincil { color: var(--murekkep-2); }
.mono { font-family: var(--f-mono); font-variant-numeric: tabular-nums; }

/* Sekmeler (Wise .sekmeler / .sekme) */
.sekmeler {
  display: flex; align-items: center; gap: var(--b2);
  margin: 0 0 var(--b7);
  border-bottom: 1px solid var(--cizgi);
  overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: thin;
  max-width: 100%; -webkit-overflow-scrolling: touch;
}
.sekmeler a {
  flex: none; display: inline-flex; align-items: center;
  padding: var(--b4) var(--b6);
  font-size: var(--ts-govde); font-weight: 500; color: var(--murekkep-2);
  text-decoration: none; white-space: nowrap;
  border-bottom: 2px solid transparent; margin-bottom: -1px;
  transition: color var(--gecis), border-color var(--gecis);
}
.sekmeler a:hover { color: var(--deniz); text-decoration: none; }
.sekmeler a[aria-current] { color: var(--deniz); border-bottom-color: var(--deniz); font-weight: 600; scroll-initial-target: nearest; }
.sekmeler a:focus-visible { outline-offset: -2px; }

/* ==========================================================================
   Düğmeler (Wise .btn / .btn-ana / .btn-tehlike / .btn-sessiz)
   Varsayılan .icerik düğmesi birincil (deniz); tablo içi ve ikincil eylemler çerçeveli.
   ========================================================================== */
.icerik button,
.dugme {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--b3);
  height: var(--btn-y); padding: 0 var(--b6);
  font: inherit; font-size: var(--ts-govde); font-weight: 500; line-height: 1.2;
  color: #FFFFFF; background: var(--deniz);
  border: 1px solid var(--deniz); border-radius: var(--r);
  text-decoration: none; cursor: pointer; white-space: nowrap;
  transition: background-color var(--gecis), border-color var(--gecis), color var(--gecis);
}
.icerik button:hover, .dugme:hover { background: var(--deniz-koyu); border-color: var(--deniz-koyu); color: #FFFFFF; text-decoration: none; }
.icerik button:disabled, .dugme[aria-disabled="true"] { opacity: .5; cursor: not-allowed; }

.icerik td button,
.icerik .kalem-ayrinti li button,
.dugme-ikincil,
.icerik .dugme-ikincil {
  color: var(--murekkep); background: var(--yuzey); border-color: var(--cizgi-koyu);
}
.icerik td button:hover,
.icerik .kalem-ayrinti li button:hover,
.dugme-ikincil:hover,
.icerik .dugme-ikincil:hover { color: var(--murekkep); background: var(--kagit-2); border-color: var(--murekkep-3); }

.dugme-tehlike,
.icerik .dugme-tehlike,
.icerik button[value="hayir"] { color: var(--mercan); background: var(--yuzey); border-color: var(--mercan); }
.dugme-tehlike:hover,
.icerik .dugme-tehlike:hover,
.icerik button[value="hayir"]:hover { color: #FFFFFF; background: var(--mercan); border-color: var(--mercan); }

.eylemler { display: flex; flex-wrap: wrap; gap: var(--b4); align-items: center; margin: var(--b6) 0; }
.eylemler form { margin: 0; }

/* ==========================================================================
   Formlar (Wise .alan / .form-alan)
   ========================================================================== */
.icerik form { margin: 0 0 var(--b7); }
.icerik form p { margin: 0 0 var(--b6); }
.icerik form p > label,
.icerik label:has(> input:not([type="radio"], [type="checkbox"]), > select, > textarea) {
  display: grid; gap: var(--b2);
  font-size: var(--ts-kucuk); font-weight: 600; color: var(--murekkep-2);
}
.icerik form p > label { margin-bottom: var(--b2); }
.icerik label:has(> input[type="radio"], > input[type="checkbox"]) {
  display: flex; align-items: center; gap: var(--b3); min-height: var(--btn-y);
  font-size: var(--ts-govde); font-weight: 500; color: var(--murekkep);
}
.icerik input:not([type="radio"], [type="checkbox"], [type="hidden"], [type="file"]),
.icerik select,
.icerik textarea {
  width: 100%; max-width: 34rem; height: var(--fyy-alan-y);
  padding: 0 var(--b4);
  font: inherit; font-size: var(--ts-govde); font-weight: 400; color: var(--murekkep);
  background: var(--yuzey);
  border: 1px solid var(--cizgi-koyu); border-radius: var(--r);
  transition: border-color var(--gecis), box-shadow var(--gecis);
}
.icerik textarea { height: auto; min-height: 70px; padding: var(--b3) var(--b4); resize: vertical; }
.icerik input[type="file"] { font: inherit; font-size: var(--ts-govde); max-width: 100%; }
.icerik input[type="file"]::file-selector-button {
  height: var(--btn-y); margin-right: var(--b5); padding: 0 var(--b6); font: inherit; font-weight: 500;
  color: var(--murekkep); background: var(--yuzey); border: 1px solid var(--cizgi-koyu); border-radius: var(--r); cursor: pointer;
}
.icerik input[type="file"]::file-selector-button:hover { background: var(--kagit-2); border-color: var(--murekkep-3); }
.icerik input:hover, .icerik select:hover, .icerik textarea:hover { border-color: var(--murekkep-3); }
.icerik input:focus, .icerik select:focus, .icerik textarea:focus {
  outline: none; border-color: var(--deniz); box-shadow: 0 0 0 2px var(--deniz-sis);
}
.icerik input[readonly] { background: var(--kagit-2); font-family: var(--f-mono); font-size: var(--ts-kucuk); }
.icerik input[type="radio"], .icerik input[type="checkbox"] { width: 16px; height: 16px; margin: 0; accent-color: var(--deniz); }
.icerik fieldset { margin: 0 0 var(--b7); padding: var(--b5) var(--b7); border: 1px solid var(--cizgi); border-radius: var(--r); max-width: 34rem; }
.icerik legend { padding: 0 var(--b2); font-weight: 600; font-size: var(--ts-kucuk); color: var(--murekkep-2); }
.helptext, .icerik form p .helptext { display: block; margin-top: var(--b2); font-size: var(--ts-mikro); font-weight: 400; color: var(--murekkep-3); }
.errorlist { list-style: none; margin: var(--b2) 0; padding: 0; color: var(--mercan); font-size: var(--ts-kucuk); font-weight: 500; }
.errorlist.nonfield li {
  padding: var(--b5) var(--b7); background: var(--mercan-sis); color: var(--fyy-bant-hata);
  border-left: 3px solid var(--mercan); border-radius: var(--r);
}

/* Form kartı: sayfanın tek formu (yeni proje, SMTP, kullanıcı ekle) — Wise .panel */
.form-kart,
.icerik > form[method="post"] {
  max-width: var(--fyy-form-en); padding: var(--b7);
  background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: var(--r-buyuk); box-shadow: var(--golge);
}
.icerik > form.satir-form { max-width: none; padding: 0; background: none; border: 0; box-shadow: none; align-items: center; }

/* Ayarlar dizini */
.ayar-listesi ul { list-style: none; margin: 0; padding: 0; max-width: 48rem; background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: var(--r-buyuk); box-shadow: var(--golge); overflow: hidden; }
.ayar-listesi li { display: flex; flex-wrap: wrap; align-items: center; gap: var(--b2) var(--b6); min-height: 44px; padding: var(--b5) var(--b7); border-bottom: 1px solid var(--cizgi); }
.ayar-listesi li:last-child { border-bottom: 0; }
.ayar-listesi li:hover { background: var(--kagit-2); }
.ayar-listesi a { font-weight: 600; }
.ayar-listesi .yer-tutucu { color: var(--murekkep-3); }

/* Satır içi formlar: süzgeç (Wise .filtreler), tablo içi eylemler, elle karar */
.suzgec, .satir-form,
.icerik td form,
.icerik form[method="get"] {
  display: flex; flex-wrap: wrap; align-items: flex-end; gap: var(--b4) var(--b6);
}
.icerik td form { margin: 0 0 var(--b2); align-items: center; gap: var(--b3) var(--b4); }
.icerik td form label { font-size: var(--ts-kucuk); }
.icerik td input:not([type="hidden"]), .icerik td select { height: var(--btn-y); max-width: 14rem; font-size: var(--ts-kucuk); }
.icerik td button { height: var(--btn-k-y); padding: 0 var(--b4); font-size: var(--ts-kucuk); }
.icerik form[method="get"] p { margin: 0; }
.icerik form[method="get"] input, .icerik form[method="get"] select { max-width: 16rem; }

/* ==========================================================================
   Tablolar (Wise .tablo — yoğun satır, büyük harf mikro başlık)
   ========================================================================== */
.icerik table {
  width: 100%; border-collapse: separate; border-spacing: 0;
  margin: 0 0 var(--b8);
  background: var(--yuzey);
  border: 1px solid var(--cizgi); border-radius: var(--r-buyuk);
  box-shadow: var(--golge);
  font-size: var(--ts-govde); font-variant-numeric: tabular-nums;
}
.icerik th, .icerik td {
  padding: var(--b3) var(--b6); height: var(--satir-y);
  text-align: left; vertical-align: middle;
  border-bottom: 1px solid var(--cizgi);
}
.icerik thead th {
  position: sticky; top: var(--topbar-y); z-index: 1;
  height: auto; padding: var(--b4) var(--b6);
  background: var(--kagit-2);
  font-size: var(--ts-mikro); font-weight: 600; text-transform: uppercase; letter-spacing: .08em;
  color: var(--murekkep-3);
  border-bottom: 1px solid var(--cizgi-koyu); white-space: nowrap;
}
.icerik thead th:first-child { border-top-left-radius: var(--r-buyuk); }
.icerik thead th:last-child { border-top-right-radius: var(--r-buyuk); }
.icerik tbody tr:hover > * { background: var(--kagit-2); }
.icerik tbody tr:last-child > *, .icerik tfoot tr:last-child > * { border-bottom: 0; }
.icerik tbody th[scope="row"] { font-weight: 500; }
.icerik tfoot th, .icerik tfoot td { font-weight: 600; border-top: 1px solid var(--cizgi-koyu); background: var(--kagit-2); }
.icerik td[colspan] { padding: var(--b8); text-align: center; color: var(--murekkep-3); }
.icerik td:first-child a { font-weight: 600; white-space: nowrap; }
.sayi, .icerik td[data-satir], .icerik tr[data-satir] td { text-align: right; font-family: var(--f-mono); font-size: var(--ts-kucuk); }
.icerik code {
  font-family: var(--f-mono); font-size: var(--ts-kucuk);
  padding: 0 var(--b2); background: var(--kagit); border: 1px solid var(--cizgi); border-radius: 3px; color: var(--murekkep);
  overflow-wrap: anywhere;
}

/* ==========================================================================
   Rozet / çip durumları (Wise .rozet)
   yeşil = tamam · kehribar = uyarı/bekliyor · mercan = ret/hata ·
   mor = askıda/kenara alındı · deniz = birincil/işlemde · gri = taslak/kapalı
   ========================================================================== */
.etiket, .rozet {
  display: inline-flex; align-items: center; gap: var(--b3);
  padding: 2px 8px;
  font-size: var(--ts-mikro); font-weight: 500; line-height: 1.4; white-space: nowrap;
  color: var(--murekkep-2); background: var(--cizgi);
  border-radius: var(--r-yuvarlak);
}
.etiket::before {
  content: ""; display: inline-block; width: 6px; height: 6px; border-radius: 50%;
  background: currentColor; flex: none;
}
.etiket-kabul, .etiket-onaylandi, .etiket-onayli, .etiket-tamam, .etiket-aktarildi, .etiket-gecerli, .etiket-acik,
.rozet-kabul { color: var(--yesil); background: var(--yesil-sis); }
.etiket-bekliyor, .etiket-kuyrukta,
.rozet-bekliyor { color: var(--kehribar); background: var(--kehribar-sis); }
.etiket-ret, .etiket-reddedildi, .etiket-hata, .etiket-gecersiz,
.rozet-ret { color: var(--mercan); background: var(--mercan-sis); }
.etiket-yuklendi, .etiket-calisiyor,
.rozet-yuklendi { color: var(--deniz); background: var(--deniz-sis); }
.etiket-muaf, .rozet-muaf { color: var(--mor); background: var(--mor-sis); }
.etiket-taslak { color: var(--murekkep-2); background: var(--cizgi); }
.etiket-kapali { color: var(--murekkep-3); background: #E8ECEE; }

/* Bulgu seviyeleri (belgeler/_bulgular.html) */
.seviye { font-family: var(--f-mono); font-size: var(--ts-kucuk); font-weight: 600; }
.seviye-hata, strong.seviye-hata { color: var(--mercan); }
.seviye-uyari, strong.seviye-uyari { color: var(--kehribar); }
.seviye-bilgi, strong.seviye-bilgi { color: var(--deniz); }
.seviye-tamam, strong.seviye-tamam { color: var(--yesil); }

/* ==========================================================================
   İletiler ve bantlar (Wise .bant-*)
   ========================================================================== */
.iletiler { list-style: none; margin: 0 0 var(--b7); padding: 0; display: grid; gap: var(--b4); max-width: 60rem; }
.iletiler li, .uyari-kutu, .icerik p.hata, .icerik p.ileti, .icerik p[role="alert"] {
  margin: 0 0 var(--b6); padding: var(--b5) var(--b7);
  border-radius: var(--r); border-left: 3px solid var(--deniz);
  background: var(--deniz-sis); color: var(--deniz-koyu);
  font-size: var(--ts-govde); line-height: 1.4; max-width: 60rem;
}
.iletiler li { margin: 0; }
.iletiler li.success, .icerik p.ileti { border-left-color: var(--yesil); background: var(--yesil-sis); color: var(--fyy-bant-basari); }
.iletiler li.warning, .uyari-kutu { border-left-color: var(--kehribar); background: var(--kehribar-sis); color: var(--fyy-bant-uyari); }
.iletiler li.error, .icerik p.hata, .icerik p[role="alert"] { border-left-color: var(--mercan); background: var(--mercan-sis); color: var(--fyy-bant-hata); font-weight: 500; }

/* ==========================================================================
   Boş durum (Wise .bos)
   ========================================================================== */
.bos, .icerik .bos {
  margin: 0 0 var(--b8); padding: var(--b8) var(--b7);
  text-align: center; color: var(--murekkep-2);
  background: var(--yuzey); border: 1px dashed var(--cizgi-koyu); border-radius: var(--r-buyuk);
  max-width: none;
}
.bos .dugme { margin-top: var(--b5); }
.icerik .bos p { margin: 0 auto; }
.icerik .bos p + p { margin-top: var(--b3); }

/* ==========================================================================
   Panel, özet, bölüm (Wise .panel)
   ========================================================================== */
.kart-blok, .kalem-ayrinti, .bolum, .icerik .kart {
  margin: 0 0 var(--b8); padding: var(--b7);
  background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: var(--r-buyuk); box-shadow: var(--golge);
}
.bolum > h2:first-child, .kalem-ayrinti > h2:first-child, .kart-blok > h2:first-child, .icerik .kart > h2:first-child { margin-top: 0; font-size: var(--ts-orta); }
.bolum-bas { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: var(--b4) var(--b7); margin-bottom: var(--b6); }
.bolum-bas h2 { margin: 0; }
.bolum table { margin-bottom: 0; box-shadow: none; }

.icerik dl {
  display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: var(--b4) var(--b8);
  margin: 0 0 var(--b8);
}
.icerik dt { color: var(--murekkep-3); font-size: var(--ts-mikro); font-weight: 600; text-transform: uppercase; letter-spacing: .08em; padding-top: 2px; }
.icerik dd { margin: 0; }

dl.ozet {
  grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr)); gap: 0;
  background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: var(--r-buyuk); box-shadow: var(--golge); overflow: hidden;
}
dl.ozet > div { padding: var(--b6) var(--b7); border-right: 1px solid var(--cizgi); }
dl.ozet > div:last-child { border-right: 0; }
dl.ozet dd { margin-top: var(--b2); font-size: var(--ts-orta); font-weight: 600; }

.duz-liste { list-style: none; margin: 0; padding: 0; }
.duz-liste li { padding: var(--b4) 0; border-bottom: 1px solid var(--cizgi); }
.duz-liste li:last-child { border-bottom: 0; }

.icerik details { margin: 0 0 var(--b7); padding: var(--b5) var(--b7); background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: var(--r); }
.icerik details > summary { cursor: pointer; font-weight: 600; min-height: var(--btn-y); display: flex; align-items: center; }
.icerik details[open] > summary { margin-bottom: var(--b5); }

.icerik nav[aria-label="Sayfalar"] { display: flex; gap: var(--b7); align-items: center; font-size: var(--ts-kucuk); color: var(--murekkep-2); }

#tamamlanma {
  display: inline-flex; align-items: center; gap: var(--b4);
  padding: var(--b4) var(--b7); background: var(--deniz-sis); color: var(--deniz-koyu);
  border-left: 3px solid var(--deniz); border-radius: var(--r); font-weight: 600;
}

/* ==========================================================================
   Dar ekran (Wise: < 860px ray gizlenir, menü üst bardan açılır)
   ========================================================================== */
@media (max-width: 860px) {
  .rail { display: none; }
  .ust-marka { display: flex; }
  .ust-marka .marka-ad { display: none; }
  .ust-bar { gap: var(--b5); padding: 0 var(--b6); }
  .mobil-menu { display: block; flex: none; position: static; }
  .mobil-menu > summary {
    display: inline-flex; align-items: center; gap: var(--b3);
    height: var(--btn-y); padding: 0 var(--b4);
    font-size: var(--ts-kucuk); font-weight: 600; color: var(--murekkep);
    border: 1px solid var(--cizgi-koyu); border-radius: var(--r);
    cursor: pointer; list-style: none;
  }
  .mobil-menu > summary::-webkit-details-marker { display: none; }
  .mobil-menu > summary::before {
    content: ""; width: 14px; height: 10px;
    background: linear-gradient(currentColor 0 0) top / 100% 2px no-repeat,
                linear-gradient(currentColor 0 0) center / 100% 2px no-repeat,
                linear-gradient(currentColor 0 0) bottom / 100% 2px no-repeat;
  }
  .mobil-menu[open] > summary { background: var(--deniz-sis); border-color: var(--deniz); color: var(--deniz-koyu); }
  .mobil-menu-panel {
    position: absolute; left: 0; right: 0; top: var(--topbar-y);
    padding: var(--b4) 0;
    background: var(--yuzey); border-bottom: 1px solid var(--cizgi); box-shadow: var(--golge-buyuk);
  }
  .mobil-menu .menu-liste a { min-height: var(--fyy-dokunma); padding-left: var(--b7); }
  .icerik { padding: var(--b7) var(--b7) var(--b8); }
  .sekmeler { margin-left: calc(-1 * var(--b7)); margin-right: calc(-1 * var(--b7)); max-width: none; padding: 0 var(--b7); scroll-padding: 0 var(--b7); }
  .sekmeler a { padding: var(--b4) var(--b5); }
}

@media (max-width: 640px) {
  .kullanici-ad { display: none; }
  .icerik h1 { font-size: 22px; }
  /* geniş tablolar sayfayı taşırmaz: tablo kendi içinde yatay kayar */
  .icerik table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .icerik thead th { position: static; }
  dl.ozet > div { border-right: 0; border-bottom: 1px solid var(--cizgi); }
  .icerik dl:not(.ozet) { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .icerik dl:not(.ozet) dd { margin-bottom: var(--b5); }
  .form-kart, .icerik > form[method="post"], .icerik .kart { padding: var(--b6); }
}

@media (max-width: 420px) {
  .kullanici-rol { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  * { transition: none !important; scroll-behavior: auto !important; }
}

@media print {
  .ust-bar, .rail, .mobil-menu, .sekmeler { display: none; }
  .kabuk { display: block; }
  body { background: #fff; }
  .icerik table, .bolum, .kart-blok { box-shadow: none; }
}