/* Yazı tipi: Archivo (OFL) — YEREL dosyalardan; internetten font indirilmez
   (çalışma kuralı 3: dış kaynak yok). Uygulamanın genel yazı tipi sistem yazı tipidir; Archivo
   yalnız marka adı satırlarında (sol menü başlığı, giriş ekranı) kullanılır. */
@font-face { font-family: 'Archivo'; font-style: normal; font-weight: 400 800; font-display: swap;
  src: url('/fonts/archivo-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
    U+2000-206F, U+20AC, U+2122; }
@font-face { font-family: 'Archivo'; font-style: normal; font-weight: 400 800; font-display: swap;
  src: url('/fonts/archivo-latinext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+1E00-1E9F, U+2020, U+20A0-20AB,
    U+20AD-20C0; }

/* AkaQMS - Arayüz stilleri
   RENK SİSTEMİ (logo paketinden): kömür #2B2F36 (zemin/başlık), yanık turuncu
   #C8511F (vurgu, birincil eylem, aktif menü), beyaz. Bilgi tonu kömürün açık
   tonudur (slate); yeşil/kırmızı/amber yalnız durum bildirir.
   --navy adı geriye dönük uyumluluk için korunur (= kömür). */
:root {
  --navy: #2B2F36;
  --navy-2: #3A3F48;
  --navy-3: #1C1F24;
  --accent: #C8511F;
  --accent-2: #A8431A;
  --bg: #F4F3F1;
  --panel: #ffffff;
  --panel-2: #F8F7F5;
  --line: #E2E0DC;
  --text: #22252B;
  --muted: #6B6F78;
  --info: #3E4A5E;
  --green: #1f9d55;
  --green-bg: #e3f5ea;
  --red: #d64545;
  --red-bg: #fdebeb;
  --orange: #A9700F;
  --orange-bg: #FBF1DC;
  --blue-bg: #EBEEF3;
  --line-2: #D3D0CA;                     /* belirgin ayraç (kart kenarı, boş durum) */
  --green-line: #B7E0C6; --red-line: #F2C4C4; --orange-line: #EBD6A8;
  --accent-rgb: 200 81 31;
  --accent-canli: #E0693A;
  /* MODÜL KİMLİĞİ — varsayılan sistem vurgusudur; ekran .mod-* ile değiştirir
     (public/js/gorsel.js bileşenleri yalnız --mod ailesini okur) */
  --mod: var(--accent);
  --mod-2: var(--accent-2);
  --mod-canli: var(--accent-canli);
  --mod-wash: #FBEDE6;
  --mod-rgb: var(--accent-rgb);
  --radius: 10px;
  --shadow: 0 1px 3px rgba(30, 33, 38, .08), 0 4px 14px rgba(30, 33, 38, .06);
}

/* Modül tonları (beyaz yazıyla ≥ 4.5:1): MSA = ölçüm/hassasiyet (petrol),
   SPC = istatistik/proses (çivit). Marka turuncusundan ve durum renklerinden
   (yeşil/kırmızı/amber) ayrışır ki "hata"/"uyarı" ile karışmasın. */
.mod-msa { --mod: #0d7f86; --mod-2: #0a666d; --mod-canli: #12959f; --mod-wash: #e1f3f4; --mod-rgb: 13 127 134; }
.mod-spc { --mod: #3d52b5; --mod-2: #2e3f8f; --mod-canli: #6d81e8; --mod-wash: #e9ecfb; --mod-rgb: 61 82 181; }

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; height: 100%; }
body {
  font-family: "Segoe UI", system-ui, -apple-system, Roboto, Arial, sans-serif;
  background: var(--bg); color: var(--text); font-size: 14px; line-height: 1.55;
}
a { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: underline; }
code { background: #EEEDEA; padding: 1px 5px; border-radius: 4px; font-size: 12px; word-break: break-all; }
hr { border: 0; border-top: 1px solid var(--line); margin: 16px 0; }
h1 { font-size: 22px; margin: 0 0 2px; font-weight: 650; }
h2 { font-size: 15px; margin: 0 0 12px; font-weight: 650; color: var(--navy); }
h3 { font-size: 15px; margin: 0; }
h4 { margin: 14px 0 8px; font-size: 13px; color: var(--navy); }

/* ---------- Açılış ---------- */
.boot-splash {
  height: 100vh; display: flex; flex-direction: column; gap: 14px;
  align-items: center; justify-content: center; color: var(--muted);
}
.boot-logo, .logo-mono {
  display: flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, var(--navy), var(--accent));
  color: #fff; font-weight: 800; border-radius: 14px;
}
.boot-logo { width: 64px; height: 64px; font-size: 34px; }
.logo-img { border-radius: 6px; object-fit: contain; max-width: 160px; }

/* ---------- Giriş ---------- */
.login-wrap {
  min-height: 100vh; display: flex; align-items: center; justify-content: center;
  background: radial-gradient(1100px 500px at 20% -10%, var(--navy-2) 0%, var(--navy-3) 55%), var(--navy-3);
  padding: 20px;
}

/* ============ VİTRİN GİRİŞ EKRANI ============
   Tanıtım videosu EKRANIN TAMAMINI kaplar (kullanıcının isteği, 2026-08-07:
   "videonun sağını solunu göremiyorum … tam kaplayacak şekilde oynatalım").
   ÖNCESİ: video yalnız sol panelde oynuyordu; 16:9 kare dar ve uzun panele
   sığmadığı için genişliğinin %46'sı kırpılıyordu. Tam ekranda 16:9
   monitörlerde (1920x1080, 1366x768, 1600x900, 2560x1440) kırpma SIFIRDIR.
   Giriş kartı videonun üstünde SAĞDA yüzer (buzlu cam), marka kimliği sol
   üstte durur (kullanıcının seçimi, 4 yerleşim arasından): form eskiden de
   sağdaydı, kas hafızası bozulmaz; kart sağda olduğu için videonun ortasında
   beliren marka logosu açıkta kalır.
   Girişsiz kimseye sistem VERİSİ gösterilmez; ekran yalnız kimliktir. */
.login-split { display: block; position: relative; min-height: 100vh; overflow: hidden; }
/* Video katmanı: ekrana sabitlenir, dört kenara yapışır. */
.lv-anim { position: fixed; inset: 0; z-index: 0; overflow: hidden; }
/* HİÇBİR YERİ KESİLMEZ (kullanıcının isteği): contain → görüntünün TAMAMI her
   ekranda görünür. cover olsaydı 16:9 dışı ekranlarda kenarlar kırpılırdı.
   16:9 ekranlarda (1920x1080, 1366x768, 1600x900, 2560x1440) şerit oluşmaz,
   video ekranı tam doldurur. Diğer oranlarda kalan ince şerit, videonun KENDİ
   üst (rgb 46,90,96) ve alt (rgb 24,54,60) kenar renginden bir gradyanla
   doldurulur — siyah bant gibi durmaz, sahnenin devamı gibi görünür.
   (Kaynak dosyanın sağ/alt siyah kenarları 2026-08-07'de dosyadan temizlendi,
   artık CSS ile kırpmaya gerek yok.) */
.lv-loop { position: absolute; left: 0; top: 0; display: block;
  width: 100%; height: 100%; object-fit: contain;
  background: linear-gradient(180deg, #f3f0ef 0%, #f3f0ef 100%); }
/* Karartma perdesi: marka ve kart, videonun parlak karelerinde de okunur
   kalsın (yalnız görsel; tıklamaları geçirir). Sağa doğru koyulaşır — kart
   havada asılı durmasın, kompozisyona otursun; sol yarı açık kalır. */
.lv-scrim { position: fixed; inset: 0; z-index: 1; pointer-events: none;
  background:
    linear-gradient(90deg, transparent 42%, rgba(43, 47, 54, .10) 66%, rgba(43, 47, 54, .28) 100%); }
.lv-brand { position: fixed; z-index: 3; left: 34px; top: 28px;
  display: flex; gap: 12px; align-items: center; }
.lv-brand b { font-size: 18px; display: block; color: var(--navy); letter-spacing: .01em; }
.lv-brand span { font-size: 11.5px; color: var(--muted); }
.lv-brand .logo-mark { border-radius: 11px; box-shadow: 0 6px 18px rgba(43, 47, 54, .18);
  background: #fff; padding: 5px; }
/* DİKKAT — özgüllük: yukarıda ".login-split .login-wrap" (iki sınıf) kuralı
   vardı ve dosyanın SONUNDA ".login-wrap::before/::after" aura lekeleri var.
   Bu yüzden aşağıdaki kuralların hepsi İKİ sınıfla yazılır; tek sınıfla
   yazılırsa kart tepeye yapışır ve aura lekeleri videonun üstüne biner
   (ikisi de yaşandı). */
.login-split .login-wrap { position: relative; z-index: 2; flex: none;
  background: none; min-height: 100vh; padding: 24px;
  display: flex; align-items: center; justify-content: flex-end;
  padding-right: clamp(24px, 7vw, 120px); }
.login-split .login-wrap::before, .login-split .login-wrap::after { display: none; }
/* Kart: buzlu cam — videoyu tamamen kapatmaz, yazılar yine de koyu ve okunur. */
.login-split .login-card { width: 372px;
  background: rgba(255, 255, 255, .94);
  -webkit-backdrop-filter: blur(22px) saturate(1.2); backdrop-filter: blur(22px) saturate(1.2);
  border: 1px solid rgba(255, 255, 255, .6);
  box-shadow: 0 26px 70px rgba(43, 47, 54, .28), 0 0 0 1px rgba(43, 47, 54, .06); }
@media (max-width: 900px) {
  /* Dar ekran/tablet: telefon 9:19 gibi bir orandadır, video yine KESİLMEZ —
     16:9 şerit hâlinde EKRANIN ÜSTÜNE yaslanır, altında kalan alanı videonun
     kendi kenar rengi doldurur. Marka şeridin hemen altında, kart en altta:
     üçü de birbirinin üstüne binmez.
     0.563 = şerit yüksekliği oranı (1070 / 1902). */
  .lv-loop { object-position: center top; }
  .lv-scrim { background: linear-gradient(180deg, transparent 0%, transparent 26%,
    rgba(43, 47, 54, .08) 46%, rgba(43, 47, 54, .22) 100%); }
  /* Marka dar ekranda alt alta dizilir: yan yana dizilişte ürün adı iki satıra
     kırılıyor ve satır dengesiz görünüyordu. */
  .lv-brand { left: 50%; transform: translateX(-50%); top: calc(100vw * 0.563 + 16px);
    flex-direction: column; gap: 8px; text-align: center; }
  .login-split .login-wrap { justify-content: center;
    padding: calc(100vw * 0.563 + 96px) 16px 24px; }
  .login-split .login-card { width: 100%; max-width: 420px; }
}
/* "Hareketi azalt" tercihi: video otomatik oynatılmaz, ilk kare sabit durur
   (blowLoop bunu kendisi yapar); bu yüzden katmanı gizlemiyoruz. */
.login-card {
  background: var(--panel); border-radius: 16px; box-shadow: 0 18px 60px rgba(0, 0, 0, .35);
  width: 380px; max-width: 100%; padding: 34px 34px 26px; display: flex; flex-direction: column; gap: 13px;
}
.login-logo { display: flex; justify-content: center; }
.login-card h1 { text-align: center; font-size: 24px; color: var(--navy); }
.login-sub { text-align: center; color: var(--muted); margin: -6px 0 8px; font-size: 13px; }
.login-note { text-align: center; color: var(--muted); font-size: 11.5px; margin: 10px 0 0; }
.login-card label { display: flex; flex-direction: column; gap: 5px; font-weight: 600; font-size: 12.5px; color: var(--navy); }

/* ---------- Form ---------- */
input, select, textarea {
  font: inherit; padding: 8px 10px; border: 1px solid var(--line); border-radius: 8px;
  background: #fff; color: var(--text); width: 100%;
}
input:focus, select:focus, textarea:focus {
  outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px rgba(200, 81, 31, .15);
}
input[type="checkbox"] { width: auto; accent-color: var(--accent); transform: scale(1.15); }
input[type="file"] { padding: 6px; background: #f7fafc; }
label { font-size: 13px; }
.form-col { display: flex; flex-direction: column; gap: 12px; }
.form-col label, .form-row label { display: flex; flex-direction: column; gap: 5px; font-weight: 600; color: var(--navy); }
.form-row { display: flex; gap: 12px; }
.form-row > * { flex: 1; }
/* Düğmeler içerik genişliğinde kalır (kutu yanında dev düğme olmasın);
   onay kutulu etiket yatay dizilir (kutu metnin üstüne kaymasın). */
.form-row > .btn { flex: 0 0 auto; }
label.row-inline, .form-row label.row-inline, .form-col label.row-inline {
  flex-direction: row; align-items: center; gap: 6px; font-weight: 500; }
label.row-inline input[type=checkbox] { width: auto; flex: 0 0 auto; margin: 0; }
.check-line { display: flex !important; flex-direction: row !important; align-items: center; gap: 8px; font-weight: 500 !important; }
.req { color: var(--red); }

/* ---------- Butonlar ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  font: inherit; font-weight: 600; font-size: 13px; cursor: pointer;
  border: 1px solid var(--line); background: #fff; color: var(--text);
  padding: 8px 14px; border-radius: 8px; transition: .15s; white-space: nowrap;
  text-decoration: none !important;
}
.btn:hover { border-color: #CFCDC8; background: #f7fafc; }
.btn:disabled { opacity: .55; cursor: not-allowed; }
.btn-primary { background: var(--accent); border-color: var(--accent); color: #fff; }
.btn-primary:hover { background: var(--accent-2); border-color: var(--accent-2); }
.btn-primary-o { border-color: var(--accent); color: var(--accent); background: var(--blue-bg); }
.btn-danger { background: var(--red); border-color: var(--red); color: #fff; }
.btn-danger-o { border-color: var(--red); color: var(--red); background: #fff; }
.btn-danger-o:hover { background: var(--red-bg); }
.btn-warn-o { border-color: var(--orange); color: var(--orange); }
.btn-block { width: 100%; }
.btn-sm { padding: 5px 10px; font-size: 12.5px; }
.btn-xs { padding: 3px 8px; font-size: 12px; border-radius: 6px; }
.icon-btn { background: none; border: 0; font-size: 15px; cursor: pointer; color: var(--muted); }
.icon-btn:hover { color: var(--text); }

/* ---------- Yerleşim ---------- */
.shell { display: flex; min-height: 100vh; }
.sidebar {
  width: 248px; flex-shrink: 0; background: linear-gradient(180deg, var(--navy) 0%, var(--navy-3) 100%);
  color: #E4E3E0; display: flex; flex-direction: column; position: sticky; top: 0; height: 100vh;
  transition: width .18s ease;
}
.side-brand { display: flex; gap: 11px; align-items: center; padding: 18px 16px 14px; }
.side-title { font-weight: 750; font-size: 16.5px; color: #fff; }
.side-sub { font-size: 11px; color: #9C9DA3; }
.side-nav { display: flex; flex-direction: column; padding: 8px 10px; gap: 2px; flex: 1;
  overflow-y: auto; min-height: 0; }
/* Çok modülde menü kendi içinde kayar; alt kullanıcı bloğu koyu zeminde sabit kalır */
.side-nav::-webkit-scrollbar { width: 7px; }
.side-nav::-webkit-scrollbar-thumb { background: rgba(255,255,255,.22); border-radius: 4px; }
.side-nav::-webkit-scrollbar-track { background: transparent; }
.side-nav { scrollbar-width: thin; scrollbar-color: rgba(255,255,255,.25) transparent; }
.side-nav a {
  display: flex; align-items: center; gap: 10px; color: #CBCAC6; padding: 9px 12px;
  border-radius: 8px; font-weight: 550; font-size: 13.5px;
}
.side-nav a:hover { background: rgba(255, 255, 255, .07); text-decoration: none; color: #fff; }
.side-nav a.active { background: var(--accent); color: #fff; }
.nav-ic { width: 20px; text-align: center; font-size: 15px; }
.side-foot { padding: 12px; border-top: 1px solid rgba(255, 255, 255, .12); flex-shrink: 0; }
.side-user { display: flex; gap: 9px; align-items: center; margin-bottom: 9px; }
.avatar {
  width: 34px; height: 34px; border-radius: 50%; background: var(--accent); color: #fff;
  display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 13px; flex-shrink: 0;
}
.su-name { font-size: 13px; font-weight: 600; color: #fff; word-break: break-word; }
.su-role { font-size: 11px; color: #9C9DA3; }
.side-user-info { min-width: 0; }
/* Bildirimler tam satır, Profil/Çıkış yan yana — dar menüde sağa TAŞMAZ */
.side-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.side-actions #btn-notif { grid-column: 1 / -1; }
.side-actions .btn { min-width: 0; white-space: nowrap; overflow: hidden;
  background: rgba(255, 255, 255, .08); border-color: rgba(255, 255, 255, .18); color: #E4E3E0; }
.side-actions .btn:hover { background: rgba(255, 255, 255, .16); }

/* ---- Daraltılabilir sol menü (yalnız masaüstü) ---- */
.side-collapse {
  position: absolute; top: 14px; right: -12px; z-index: 5;
  width: 24px; height: 24px; border-radius: 50%; border: 1px solid var(--line);
  background: #fff; color: var(--navy); font-size: 12px; font-weight: 700;
  cursor: pointer; box-shadow: var(--shadow); line-height: 1;
}
.side-collapse:hover { background: var(--accent); color: #fff; }
@media (min-width: 861px) {
  .sidebar.collapsed { width: 64px; }
  .sidebar.collapsed .side-brand-tx,
  .sidebar.collapsed .side-user-info,
  .sidebar.collapsed .side-actions .b-tx,
  .sidebar.collapsed .nav-tx,
  .sidebar.collapsed .nav-grp { display: none; }
  .sidebar.collapsed .side-brand { justify-content: center; padding-left: 8px; padding-right: 8px; }
  .sidebar.collapsed .side-nav a { justify-content: center; padding: 10px 0; }
  .sidebar.collapsed .nav-ic { width: auto; font-size: 17px; }
  /* Daraltılmış rayda kapalı gruplar da ikon olarak görünsün (başlık zaten gizli) */
  .sidebar.collapsed .nav-grp-box.closed .nav-grp-items { display: flex; }
  .sidebar.collapsed .side-user { justify-content: center; margin-bottom: 6px; }
  .sidebar.collapsed .side-foot { padding: 10px 8px; }
  .sidebar.collapsed .side-actions { grid-template-columns: 1fr; }
  .sidebar.collapsed .side-actions .btn { padding: 7px 0; text-align: center; }
  /* Daraltılmış rayda okunmamış sayısı zilin köşesinde küçük rozet olur */
  .sidebar.collapsed .notif-badge { position: absolute; top: -5px; right: 2px; margin: 0;
    min-width: 16px; height: 16px; line-height: 16px; font-size: 10px; padding: 0 4px; }
}
@media (max-width: 860px) {
  .side-collapse { display: none; }        /* mobilde menü çekmecede, daraltma yok */
}

.content { flex: 1; padding: 22px 26px 60px; max-width: 1380px; min-width: 0; }

/* ---------- Sayfa başlığı ---------- */
.page-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 14px; margin-bottom: 16px; flex-wrap: wrap; }
.head-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.crumbs { font-size: 12.5px; color: var(--muted); margin-bottom: 8px; }
.muted { color: var(--muted); }
.small { font-size: 12px; }
.nowrap { white-space: nowrap; }
.loading { padding: 40px; text-align: center; color: var(--muted); }
.empty { padding: 50px; text-align: center; color: var(--muted); background: var(--panel); border-radius: var(--radius); }

/* ---------- Panel & istatistik ---------- */
.panel { background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); padding: 16px 18px; margin-bottom: 16px; }
.two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; align-items: start; }
.doc-grid { display: grid; grid-template-columns: 5fr 7fr; gap: 16px; align-items: start; }
@media (max-width: 1100px) { .two-col, .doc-grid { grid-template-columns: 1fr; } }

.stat-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 14px; margin-bottom: 18px; }
.stat-card {
  background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: var(--shadow); padding: 16px 18px; cursor: pointer; transition: .15s;
}
.stat-card:hover { transform: translateY(-2px); box-shadow: 0 6px 18px rgba(30, 33, 38, .12); }
.stat-num { font-size: 30px; font-weight: 750; color: var(--navy); line-height: 1.1; }
.stat-label { font-weight: 650; margin-top: 2px; }
.stat-sub { color: var(--muted); font-size: 12px; margin-top: 3px; }
.stat-warn .stat-num { color: var(--red); }

/* ---------- Sekmeler ---------- */
.tabs { display: flex; gap: 4px; border-bottom: 2px solid var(--line); margin-bottom: 14px; flex-wrap: wrap; }
.tab {
  font: inherit; font-weight: 600; font-size: 13.5px; background: none; border: 0;
  padding: 9px 16px; cursor: pointer; color: var(--muted);
  border-bottom: 2.5px solid transparent; margin-bottom: -2px;
}
.tab:hover { color: var(--text); }
.tab.active { color: var(--accent); border-bottom-color: var(--accent); }
.tabs-sm .tab { padding: 6px 12px; font-size: 12.5px; }

/* ---------- Filtre çubuğu ---------- */
.filter-bar { display: flex; gap: 8px; margin-bottom: 12px; flex-wrap: wrap; }
.filter-bar input, .filter-bar select { width: auto; min-width: 130px; flex: 0 1 auto; }
.filter-bar input[id$="-q"], .filter-bar input#f-q { flex: 1 1 240px; }

/* ---------- Tablo ---------- */
.table { width: 100%; border-collapse: collapse; background: var(--panel); border-radius: var(--radius); }
.table th {
  text-align: left; font-size: 11.5px; letter-spacing: .04em; text-transform: uppercase;
  color: var(--muted); padding: 9px 10px; border-bottom: 2px solid var(--line); white-space: nowrap;
}
.table td { padding: 9px 10px; border-bottom: 1px solid #edf1f6; vertical-align: top; }
.table tbody tr:last-child td { border-bottom: 0; }
.table-hover tbody tr:hover, .rowlink:hover { background: var(--panel-2); }
.rowlink { cursor: pointer; }
.table-dense td, .table-dense th { padding: 6px 8px; font-size: 12.5px; }
.row-overdue { background: #fff7f5; }
.row-inactive { opacity: .55; }
.t-actions { white-space: nowrap; display: flex; gap: 4px; }
.hash { font-family: Consolas, monospace; font-size: 11px; color: var(--muted); word-break: break-all; }
.ok-text { color: var(--green); font-weight: 700; }
.warn-text { color: var(--orange); font-weight: 700; }
.danger-text { color: var(--red); }

/* ---------- Rozetler ---------- */
.badge {
  display: inline-block; font-size: 10.5px; font-weight: 750; letter-spacing: .04em;
  padding: 2.5px 8px; border-radius: 20px; vertical-align: middle; white-space: nowrap;
}
.badge-live { background: var(--green-bg); color: var(--green); }
.badge-rev { background: var(--blue-bg); color: var(--info); }
.badge-ro { background: #ECEAE6; color: #5d6b7c; }
.badge-cat { background: #f0ebfa; color: #6b46c1; }
.badge-plain { background: #EEEDEA; color: var(--muted); }
.badge-restricted { background: #fdeee2; color: #b25e09; }
.badge-pending { background: var(--orange-bg); color: var(--orange); }
.badge-danger { background: var(--red-bg); color: var(--red); }
.badge-info-b { background: var(--blue-bg); color: var(--info); }
.badge-8d { background: #1f3b5c; color: #fff; }
.badge-dof { background: #3c5a7a; color: #fff; }
.lock-ic { font-size: 14px; }

/* ---------- Dosya ikonları ---------- */
.file-ic {
  display: inline-flex; align-items: center; justify-content: center;
  width: 36px; height: 36px; border-radius: 8px; font-size: 10px; font-weight: 800; color: #fff;
  flex-shrink: 0;
}
.file-ic-lg { width: 46px; height: 46px; font-size: 12px; }
.fi-xls { background: #1d7044; }
.fi-doc { background: #2b579a; }
.fi-ppt { background: #c43e1c; }
.fi-pdf { background: #b62324; }
.fi-img { background: #7048ad; }
.fi-zip { background: #8a6d3b; }
.fi-gen { background: #5d6b7c; }

/* ---------- Doküman detayı ---------- */
.doc-head { align-items: center; }
.doc-title-wrap { display: flex; gap: 13px; align-items: center; }
.doc-meta-line { display: flex; gap: 7px; align-items: center; margin-top: 5px; flex-wrap: wrap; }
.def-list { display: grid; grid-template-columns: 130px 1fr; gap: 7px 12px; margin: 0; }
.def-list dt { color: var(--muted); font-size: 12.5px; padding-top: 1px; }
.def-list dd { margin: 0; word-break: break-word; }
.preview-frame { width: 100%; height: 640px; border: 1px solid var(--line); border-radius: 8px; }
.preview-img { max-width: 100%; border: 1px solid var(--line); border-radius: 8px; }
.profile-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.profile-grid > div { display: flex; flex-direction: column; }
.office-link-row { display: flex; gap: 8px; margin: 12px 0; }
.steps-list { margin: 10px 0; padding-left: 20px; }
.steps-list li { margin-bottom: 6px; }
.file-list { list-style: none; padding: 0; margin: 0 0 10px; }
.file-list li { padding: 4px 0; }

/* ---------- Uyarılar ---------- */
.alert { border-radius: 8px; padding: 11px 14px; margin-bottom: 14px; font-size: 13px; overflow-wrap: anywhere; }
.alert-info { background: var(--blue-bg); color: var(--info); border: 1px solid #D5D9E1; }
.alert-warn { background: var(--orange-bg); color: #8a5a10; border: 1px solid #f3ddb5; }
.alert-error { background: var(--red-bg); color: #97282f; border: 1px solid #f5c8c8; }
.alert-ok { background: var(--green-bg); color: #1c7a40; border: 1px solid #cfe9d6; }

/* CCAR tablo görünümü — Excel düzeni: tüm kolonlar yan yana, yatay kaydırmalı */
.gc-tablo-sar { overflow-x: auto; margin-top: 8px; }
.gc-tablo { border-collapse: collapse; width: max-content; min-width: 100%; font-size: 12px; }
.gc-tablo th { position: sticky; top: 0; background: var(--navy); color: #fff; padding: 7px 9px;
  text-align: left; white-space: nowrap; z-index: 1; font-size: 11px; letter-spacing: .02em; }
/* Kenarlıklar: kullanıcının isteği — "kenarlık ekleyelim, kolay gözle
   seçilebilsin". Her hücre Excel gibi çerçeveli. */
.gc-tablo td { border: 1px solid #E2E0DC; padding: 6px 9px; vertical-align: top; max-width: 280px; }
.gc-tablo th { border: 1px solid var(--navy-2); }
.gc-tablo tbody tr:hover { background: var(--panel-2); }
.gc-tablo tbody tr.gec td:first-child { box-shadow: inset 3px 0 0 #D64545; }
.gc-tablo .kisalt { max-width: 260px; overflow: hidden; display: -webkit-box;
  -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.gc-tablo .num { display: block; text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.gc-tablo .bos { color: #b8c2d0; }
.gc-tablo .kat { font-weight: 700; font-size: 11px; color: var(--info); }

/* Hücre içi düzenleme (Excel gibi): tıkla → yaz, blok yapıştır */
.gc-yaz-ipucu { display: flex; flex-wrap: wrap; gap: 6px 16px; align-items: baseline;
  margin-top: 10px; padding: 8px 12px; background: var(--blue-bg);
  border: 1px solid #D5D9E1; border-radius: 8px; font-size: 12px; color: var(--info); }
.gc-yaz-ipucu span { color: #3f6ea8; }
.gc-tablo.gc-yaz td.gc-hcr { cursor: cell; }
.gc-tablo.gc-yaz td.gc-hcr:hover { background: #FBEDE6; box-shadow: inset 0 0 0 1px #E0A184; }
.gc-tablo.gc-yaz td.gc-hcr.sec { box-shadow: inset 0 0 0 2px var(--accent); background: #FBEDE6; }
.gc-tablo.gc-yaz td.gc-ac { cursor: pointer; }
.gc-tablo.gc-yaz td.gc-ac:hover { background: #eef1f6; text-decoration: underline; }
.gc-tablo .gc-inp { width: 100%; min-width: 130px; box-sizing: border-box; font: inherit;
  font-family: inherit; border: 0; outline: 2px solid var(--accent); border-radius: 3px;
  padding: 4px 5px; background: #fff; color: #1b2733; resize: vertical; }
.gc-tablo td.kayitli { animation: gcKayitFlas 1.2s ease-out; }
@keyframes gcKayitFlas { 0% { background: #bdecca; } 100% { background: transparent; } }
/* Tablodan boş satır ekleme (toplantıda yeni kayıt) */
.gc-satir-ekle-bar { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 10px; }
.gc-satir-ekle-bar select { width: auto; min-width: 96px; }
.gc-tablo tbody tr.bos td { background: #fdfbf3; }
.gc-tablo tbody tr.bos td:first-child { box-shadow: inset 3px 0 0 #c7952a; }
.gc-tablo .gc-bos-not { color: #a9791a; font-style: italic; }
.gc-tablo td.gc-satir-islem { border-left: 0; padding: 4px 6px; text-align: center; }
.gc-bos-sil { border: 1px solid #f0cfcf; background: #fff; color: #97282f; border-radius: 6px;
  cursor: pointer; font-size: 12px; line-height: 1; padding: 4px 6px; }
.gc-bos-sil:hover { background: var(--red-bg); }

/* Benzer problemler paneli (kayıt penceresi altı) */
.gc-bnz { border: 1px solid var(--line); border-radius: 10px; padding: 8px 11px; margin-bottom: 7px; font-size: 12.5px; }
.gc-bnz .bas { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-bottom: 3px; }
.gc-bnz .aks { margin-top: 4px; color: #1c5c34; background: #f0f8f2; border-radius: 7px; padding: 5px 8px;
  display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }

/* Kolon süzgeçleri (Excel otomatik süzgeci) */
.gc-th { display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; }
.gc-huni { border: 0; background: transparent; color: #9db6d6; cursor: pointer; font-size: 11px;
  line-height: 1; padding: 2px 3px; border-radius: 4px; }
.gc-huni:hover { background: rgba(255, 255, 255, .18); color: #fff; }
.gc-huni.on { color: #ffd166; }
.gc-suz-serit { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-top: 10px;
  padding: 7px 10px; background: var(--orange-bg); border: 1px solid #f0ddb5;
  border-radius: 8px; font-size: 12px; color: #8a5a10; }
.gc-suz-cip { display: inline-flex; align-items: center; gap: 5px; background: #fff;
  border: 1px solid #e6d3ae; border-radius: 999px; padding: 2px 5px 2px 10px; }
.gc-suz-cip button { border: 0; background: transparent; cursor: pointer; color: #97282f;
  font-size: 12px; line-height: 1; padding: 2px 4px; }
.gc-suz-liste { max-height: 260px; overflow: auto; border: 1px solid #E2E0DC; border-radius: 8px; padding: 4px; }
/* .form-col label kuralı (dikey dizilim) bu satırlar için ezilir */
.form-col .gc-suz-sat { display: grid; grid-template-columns: 18px 1fr auto; gap: 8px;
  align-items: center; padding: 4px 7px; border-radius: 6px; font-size: 13px;
  font-weight: 500; color: inherit; cursor: pointer; }
.form-col .gc-suz-sat input { width: auto; margin: 0; }
.gc-suz-sat:hover { background: var(--blue-bg); }
.gc-suz-sat b { font-variant-numeric: tabular-nums; color: var(--muted); font-weight: 600; font-size: 11px; }

/* Yapıştırma önizlemesi (modal içi) */
.gc-onizle { max-height: 340px; overflow: auto; border: 1px solid #E2E0DC; border-radius: 8px; }
.gc-onizle .eski { color: #97282f; text-decoration: line-through; }
.gc-onizle .yeni { color: #1c7a40; }
.alert.small { font-size: 12px; padding: 8px 11px; }

/* ---------- DÖF adımları ---------- */
.progress { height: 8px; border-radius: 6px; background: #e7edf4; overflow: hidden; margin-bottom: 12px; }
.progress-fill { height: 100%; background: linear-gradient(90deg, var(--accent), var(--green)); transition: width .4s; }
.steps-acc { display: flex; flex-direction: column; gap: 6px; }
.step { border: 1px solid var(--line); border-radius: 8px; background: #fbfcfe; }
.step summary {
  cursor: pointer; padding: 9px 12px; font-weight: 600; font-size: 13px;
  display: flex; align-items: center; gap: 8px; list-style: none;
}
.step summary::-webkit-details-marker { display: none; }
.step-check { width: 20px; height: 20px; border-radius: 50%; background: #e7edf4; color: var(--muted);
  display: inline-flex; align-items: center; justify-content: center; font-size: 12px; flex-shrink: 0; }
.step-done .step-check { background: var(--green); color: #fff; }
.step-done summary { color: var(--green); }
.step-body { padding: 0 12px 12px; }
.step-actions { display: flex; align-items: center; gap: 14px; margin-top: 8px; }

/* ---------- KPI kartları ---------- */
.kpi-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(330px, 1fr)); gap: 14px; }
.kpi-card { background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); padding: 14px 16px; display: flex; flex-direction: column; gap: 9px; }
.kpi-card-head { display: flex; gap: 10px; align-items: center; }
.kpi-card-head > div { flex: 1; min-width: 0; }
.kpi-card-actions { display: flex; gap: 6px; }

/* ---------- Rol yongaları & matris ---------- */
.role-chips { display: flex; gap: 8px; flex-wrap: wrap; margin: 8px 0 4px; }
.chip {
  font: inherit; font-size: 13px; font-weight: 600; cursor: pointer;
  border: 1.5px solid var(--line); background: #fff; border-radius: 20px; padding: 6px 14px;
}
.chip.active { border-color: var(--accent); background: var(--blue-bg); color: var(--accent-2); }
.perm-matrix input[type=checkbox] { transform: scale(1.2); }
.perm-matrix td, .perm-matrix th { text-align: center; }
.perm-matrix td:first-child, .perm-matrix th:first-child { text-align: left; }
.logo-preview { margin-bottom: 12px; }
.logo-preview img { max-height: 80px; max-width: 240px; border: 1px solid var(--line); border-radius: 8px; padding: 6px; background: #fff; }

/* ---------- Sayfalama ---------- */
.pagination { display: flex; align-items: center; gap: 12px; justify-content: center; padding: 12px; color: var(--muted); font-size: 13px; }

/* ---------- Modal ---------- */
.modal-backdrop {
  position: fixed; inset: 0; background: rgba(20, 22, 26, .55); z-index: 100;
  display: flex; align-items: flex-start; justify-content: center; padding: 6vh 16px; overflow-y: auto;
}
.modal {
  background: var(--panel); border-radius: 14px; width: 540px; max-width: 100%;
  box-shadow: 0 24px 70px rgba(0, 0, 0, .35); animation: pop .18s ease-out;
}
.modal-wide { width: 760px; }
@keyframes pop { from { transform: translateY(14px); opacity: 0; } to { transform: none; opacity: 1; } }
.modal-head { display: flex; justify-content: space-between; align-items: center; padding: 15px 20px 11px; border-bottom: 1px solid var(--line); }
.modal-head h3 { color: var(--navy); min-width: 0; overflow-wrap: anywhere; }
.modal-body { padding: 16px 20px; max-height: 68vh; overflow-y: auto; }
/* flex-wrap ZORUNLU: düğmeler sığmadığında sarmalanmazsa justify-content:
   flex-end yüzünden pencerenin SOL kenarından dışarı taşarlar (yaşandı:
   masraf fişinde 7 düğme → "🖨 Yazdır" kutunun dışına düştü, 2026-08-24).
   Sarmalanınca alt satıra inip sağa yaslanırlar. */
.modal-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end;
  gap: 8px; padding: 12px 20px 16px; border-top: 1px solid var(--line); }
/* İkincil eylem grubu (yazdır/sil gibi) solda toplanır, ana eylemler sağda kalır */
.modal-foot-sol { display: flex; gap: 8px; margin-right: auto; }
.confirm-msg { margin: 4px 0; }

/* ---------- Toast ---------- */
#toasts { position: fixed; right: 18px; bottom: 18px; display: flex; flex-direction: column; gap: 8px; z-index: 200; max-width: 380px; }
.toast {
  background: var(--navy); color: #fff; border-radius: 10px; padding: 11px 16px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, .25); font-size: 13.5px; animation: slidein .25s ease-out;
  overflow-wrap: anywhere;
}
.toast-success { background: var(--green); }
.toast-error { background: var(--red); }
.toast.out { opacity: 0; transform: translateX(20px); transition: .3s; }
@keyframes slidein { from { transform: translateX(30px); opacity: 0; } to { transform: none; opacity: 1; } }

/* ---------- Mobil ---------- */
@media (max-width: 860px) {
  /* Menü artık üstte yığılmaz: çekmece düzeni dosya sonundaki MOBİL bloğunda */
  .content { padding: 14px; }
  .form-row { flex-direction: column; }
  .def-list { grid-template-columns: 110px 1fr; }
}

/* Giriş pop-up mesajı */
.login-popup-body { font-size: 14.5px; line-height: 1.65; }

/* Genel geri tuşu (içerik alanının üstünde; ana sayfada gizli).
   [hidden] kuralı şart: .btn'nin display'i tarayıcının hidden varsayılanını ezer. */
#btn-back { margin-bottom: 10px; }
#btn-back[hidden] { display: none; }

/* ---------- Yazdırma ---------- */
@media print {
  /* Tanıtım animasyonu koyu zeminlidir — kâğıda basılmaz (mürekkep israfı) */
  .sidebar, .head-actions, .filter-bar, .pagination, #toasts, #btn-back,
  .dash-anim { display: none !important; }
  .content { padding: 0; }
  .panel { box-shadow: none; border: 0; }
}

/* ========== v2 bileşenleri ========== */

/* Güvenlik sınıfı rozetleri */
.badge-sec-g { background: #e3f5ea; color: #1c7a40; }
.badge-sec-d { background: #e7f0fd; color: var(--info); }
.badge-sec-x { background: #fbdcdc; color: #a02020; }

/* Klasör yongaları */
.folder-chips { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; }

/* Sürükle-bırak alanı */
.dropzone {
  border: 2.5px dashed #b9c8d8; border-radius: 12px; background: var(--panel-2);
  padding: 22px; text-align: center; transition: .15s; margin-bottom: 12px;
}
.dropzone.drag { border-color: var(--accent); background: var(--blue-bg); }
.dz-inner { display: flex; flex-direction: column; align-items: center; gap: 8px; }
.dz-icon { font-size: 30px; color: var(--accent); }
.bulk-defaults { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-bottom: 12px;
  background: var(--blue-bg); border: 1px solid var(--line); border-radius: 8px; padding: 10px 12px; }
.bulk-defaults select, .bulk-defaults input { width: auto; }
.bulk-defaults #bd-part { width: 230px !important; }
/* Toplu yükleme tablosu: kutular okunaklı boyutta olsun (kullanıcı geri bildirimi) */
.bulk-table input, .bulk-table select { padding: 7px 9px; font-size: 13.5px; }
.bulk-table td { vertical-align: middle; }
.bulk-table input[data-k="title"] { min-width: 180px; }
.bulk-table .bulk-part { width: 170px; }
.bulk-table .bulk-legacy { width: 100px; }
.bulk-status { font-size: 12.5px; white-space: nowrap; min-width: 60px; }
.input-with-btn { display: flex; gap: 6px; }
.input-with-btn input { flex: 1; }

/* Operatör üretim ekranı */
.op-shell { min-height: 100vh; background: var(--bg); display: flex; flex-direction: column; }
.op-head {
  background: linear-gradient(90deg, var(--navy), var(--navy-2)); color: #fff;
  display: flex; justify-content: space-between; align-items: center; padding: 12px 22px;
}
.op-brand { display: flex; align-items: center; gap: 12px; font-size: 19px; font-weight: 750; }
.op-user { display: flex; align-items: center; gap: 12px; font-size: 14px; }
.op-main { max-width: 880px; margin: 0 auto; padding: 34px 18px 60px; width: 100%; }
.op-main h1 { font-size: 26px; text-align: center; color: var(--navy); }
.op-hint { text-align: center; color: var(--muted); margin: 4px 0 18px; }
.op-search { display: flex; gap: 10px; max-width: 560px; margin: 0 auto 14px; }
.op-search input {
  font-size: 22px; padding: 14px 18px; border-radius: 12px; text-align: center;
  letter-spacing: .06em; font-weight: 600;
}
.btn-xl { font-size: 17px; padding: 14px 26px; border-radius: 12px; }
.btn-lg { font-size: 15px; padding: 10px 18px; }
.op-recent { text-align: center; margin-bottom: 18px; color: var(--muted); font-size: 13px;
  display: flex; gap: 6px; justify-content: center; align-items: center; flex-wrap: wrap; }
.op-part-head { display: flex; align-items: baseline; gap: 12px; margin: 10px 0 14px; }
.op-part-head h2 { font-size: 24px; margin: 0; }
.op-doc-list { display: flex; flex-direction: column; gap: 10px; }
.op-doc-card {
  background: var(--panel); border: 1px solid var(--line); border-radius: 12px;
  box-shadow: var(--shadow); padding: 14px 16px; display: flex; align-items: center; gap: 14px;
}
.op-doc-info { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.op-doc-info b { font-size: 16px; }
.op-doc-actions { display: flex; gap: 8px; }
.op-empty {
  background: var(--panel); border: 1px solid var(--line); border-radius: 12px;
  padding: 26px; text-align: center; color: var(--muted); font-size: 16px;
}

/* Ishikawa ızgarası */
.ishi-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 10px; }
.ishi-box { border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; background: #fbfcfe; }
.ishi-box > b { color: var(--navy); display: block; margin-bottom: 6px; }
.ishi-list { list-style: none; margin: 0 0 8px; padding: 0; font-size: 12.5px; }
.ishi-list li { padding: 2px 0; }
.ishi-del { border: 0; background: none; color: var(--red); cursor: pointer; font-size: 11px; }
.ishi-add { display: flex; gap: 5px; }
.ishi-add input { padding: 4px 7px; font-size: 12px; }

/* İç denetim */
.ia-summary { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-bottom: 14px; }
/* Denetim soru kategorisi rozeti (renk kategori kaydından inline gelir) */
.ia-cat { display: inline-block; padding: 1px 8px; border-radius: 10px; font-size: 10.5px;
  font-weight: 700; border: 1px solid; white-space: nowrap; vertical-align: middle; }
.ia-items { display: flex; flex-direction: column; gap: 10px; }
.ia-item { border: 1px solid var(--line); border-radius: 10px; padding: 11px 14px; background: #fbfcfe; }
.ia-item.ia-minor { border-left: 4px solid var(--orange); }
.ia-item.ia-major { border-left: 4px solid var(--red); }
.ia-q { margin-bottom: 8px; display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.ia-controls { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.ia-results { display: flex; flex-wrap: wrap; gap: 4px; }
.res-btn {
  font: inherit; font-size: 12px; font-weight: 700; padding: 5px 10px; cursor: pointer;
  border: 1.5px solid var(--line); background: #fff; border-radius: 7px; color: var(--muted);
}
.res-btn.active.res-ok { background: var(--green-bg); border-color: var(--green); color: var(--green); }
.res-btn.active.res-obs { background: var(--blue-bg); border-color: var(--accent); color: var(--accent-2); }
.res-btn.active.res-min { background: var(--orange-bg); border-color: var(--orange); color: var(--orange); }
.res-btn.active.res-maj { background: var(--red-bg); border-color: var(--red); color: var(--red); }
.res-btn.active.res-na { background: #ECEAE6; border-color: #8d9aa9; color: #5d6b7c; }
.res-btn:disabled { opacity: .6; cursor: default; }
.ia-note { flex: 1; min-width: 220px; padding: 6px 9px; font-size: 13px; }
.q-select-list { max-height: 320px; overflow-y: auto; border: 1px solid var(--line);
  border-radius: 8px; padding: 8px 12px; display: flex; flex-direction: column; gap: 5px; }
.q-item { padding: 2px 0; }

/* Rol editörü: tip kısıt ızgarası */
.type-restrict-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 4px 14px; border: 1px solid var(--line); border-radius: 8px; padding: 10px 14px; }

/* Toplu operatör görünürlüğü çubuğu */
.bulk-opvis-bar { display: flex; gap: 8px; align-items: center; flex-wrap: wrap;
  background: var(--blue-bg); border: 1px solid #D5D9E1; border-radius: 8px;
  padding: 7px 12px; margin-bottom: 10px; }
.sel-row, #sel-all { transform: scale(1.25); cursor: pointer; }
.list-tools { display:flex; gap:10px; align-items:center; margin-bottom:8px; }

/* Performans modülü (eklemeli) */
.table .num, th.num { text-align: right; white-space: nowrap; }
.row-actions { white-space: nowrap; text-align: right; }
.row-actions .btn { margin-left: 4px; }
.perf-detail-head { display: flex; justify-content: space-between; align-items: center;
  gap: 12px; flex-wrap: wrap; margin-bottom: 6px; }

/* YIS modülü (eklemeli) */
.yis-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; margin: 4px 0 10px; }
.yis-card { text-align: left; cursor: pointer; border: 1px solid var(--line); border-radius: 10px;
  padding: 14px 16px; background: #fff; font: inherit; }
.yis-card:hover { box-shadow: 0 2px 10px rgba(0,0,0,.08); }
.yis-card-num { font-size: 26px; font-weight: 800; color: var(--navy); line-height: 1; }
.yis-card-lbl { font-size: 12px; color: #69788a; margin-top: 4px; }
.yis-card.c-warn .yis-card-num { color: #b8860b; }
.yis-card.c-danger .yis-card-num { color: #c0392b; }
.yis-card.c-info .yis-card-num { color: var(--info); }
tr.yis-od td { background: #fdecec; }
tr.yis-soon td { background: #fff7e6; }
html[data-theme="dark"] tr.yis-od td { background: rgba(214, 69, 69, .16); }
html[data-theme="dark"] tr.yis-soon td { background: rgba(199, 123, 20, .16); }
html[data-theme="dark"] .kl-plan .bu-ay { background: rgba(224, 105, 58, .12); }
.yis-appr-list { max-height: 220px; overflow-y: auto; border: 1px solid var(--line); border-radius: 8px;
  padding: 8px 12px; display: flex; flex-direction: column; gap: 4px; }
.yis-history { display: flex; flex-direction: column; gap: 6px; }
.yis-hist-item { border-left: 3px solid var(--line); padding: 4px 10px; background: var(--panel-2); border-radius: 0 6px 6px 0; }
.yis-hist-item.ok { border-left-color: #2e8b57; }
.yis-hist-item.no { border-left-color: #c0392b; }
.perf-attach { margin-top: 14px; border-top: 1px solid var(--line); padding-top: 10px; }
.perf-attach h4 { margin: 0 0 8px; }
.perf-comp { margin-top: 14px; border-top: 1px solid var(--line); padding-top: 10px; }
.perf-comp h4 { margin: 0 0 8px; }
/* Performans — özet kartları, prim havuzu, kurallar */
.perf-kat-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 10px; margin: 8px 0 10px; }
.perf-kat-kart { border: 1px solid var(--line); border-left: 4px solid #A9ABB1; border-radius: 10px; padding: 9px 12px; background: var(--panel); }
.perf-kat-kart.puan { border-left-color: var(--accent); }
.perf-kat-kart.ok { border-left-color: var(--green); }
.perf-kat-kart.uyari { border-left-color: var(--orange); }
.perf-kat-kart .e { font-size: 12px; font-weight: 700; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.perf-kat-kart .v { font-size: 24px; font-weight: 800; line-height: 1.15; margin-top: 4px; color: var(--navy); }
.perf-kat-kart .a { font-size: 11.5px; color: var(--muted); margin-top: 3px; line-height: 1.35; }
.perf-puan-satir { display: inline-flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-top: 4px; }
.perf-tutar { font-weight: 700; color: #1d6b3a; background: var(--green-bg); padding: 2px 8px; border-radius: 8px; }
.perf-prim-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 14px; margin-bottom: 12px; }
.perf-prim-grid .panel { margin-bottom: 0; }
.perf-ozet-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 8px 14px; }
.perf-ozet-grid .e { font-size: 10.5px; letter-spacing: .05em; color: var(--muted); font-weight: 700; }
.perf-ozet-grid .v { font-size: 18px; font-weight: 800; color: var(--navy); white-space: nowrap; }
.perf-ozet-grid .v.neg { color: var(--red); }
.perf-ozet-grid .a { font-size: 11px; color: var(--muted); }
.perf-havuz-ozet { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; padding: 8px 12px; margin-bottom: 10px;
  border-radius: 10px; background: var(--green-bg); border: 1px solid #cfe8d8; font-size: 13px; }
.perf-havuz-ozet.yok { background: var(--orange-bg); border-color: #f3ddb5; }
tr.perf-disi td { opacity: .6; }
.perf-tablo td, .perf-tablo th { vertical-align: middle; }
html[data-theme="dark"] .perf-kat-kart .v, html[data-theme="dark"] .perf-ozet-grid .v { color: #E6E5E2; }
html[data-theme="dark"] .perf-kat-kart, html[data-theme="dark"] .perf-havuz-ozet { background: var(--panel-2); }
html[data-theme="dark"] .perf-havuz-ozet { border-color: rgba(255, 255, 255, .12); }
html[data-theme="dark"] .perf-tutar { background: #16321f; color: #7fd6a0; }
.qos-acc-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 4px 14px; margin-top: 8px; }
.qos-acc-item { font-size: 13px; }
.qos-overview th, .qos-overview td { white-space: nowrap; }
.qos-overview .qos-cell { text-align: center; min-width: 42px; }
.qos-overview .qos-ok { background: #e3f5e7; color: #1d6b34; font-weight: 600; }
.qos-overview .qos-bad { background: #fde0e0; color: #b3261e; font-weight: 600; }
.qos-overview .qos-deprow td { background: var(--blue-bg); font-size: 13px; }
/* Hücreye tıkla → değer gir (Excel hissi): tıklanabilir hücre + içinde bulunulan ay */
.qos-overview .qos-cell-edit { cursor: pointer; }
.qos-overview .qos-cell-edit:hover { outline: 2px solid var(--accent); outline-offset: -2px; background: #eaf2fd; }
.qos-overview .qos-cell-edit.qos-ok:hover { background: #d5efdc; }
.qos-overview .qos-cell-edit.qos-bad:hover { background: #fbd0d0; }
.qos-overview th.qos-m-now { background: var(--accent); color: #fff; }
.qos-overview .qos-dof { text-decoration: none; }

/* Sistem Durumu (sağlık ekranı) */
.health-head { display: flex; align-items: center; gap: 14px; padding: 14px 16px; border-radius: 10px;
  margin-bottom: 16px; border: 1px solid var(--border, #dde3ea); background: #fff; }
.health-head h2 { margin: 0; font-size: 18px; }
.health-head.health-ok { background: var(--green-bg); border-color: #b7e2c6; }
.health-head.health-warn { background: #fff6e0; border-color: #f0d98a; }
.health-head.health-crit { background: var(--red-bg); border-color: #f1bcbc; }
.health-dot { font-size: 20px; line-height: 1; }
.health-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; }
.health-card { border: 1px solid var(--border, #dde3ea); border-left-width: 5px; border-radius: 8px;
  padding: 12px 14px; background: #fff; }
.health-card.health-ok { border-left-color: var(--green); }
.health-card.health-warn { border-left-color: #e6a700; }
.health-card.health-crit { border-left-color: var(--red); }
.health-card-top { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.health-label { font-weight: 600; color: var(--ink, #2a2f36); }
.health-value { font-size: 18px; font-weight: 700; }
.health-detail { margin-top: 4px; word-break: break-word; }

/* Bildirimler (zil + gelen kutusu) */
#btn-notif { position: relative; }
.notif-badge { display: inline-block; min-width: 18px; height: 18px; padding: 0 5px; margin-left: 6px;
  background: var(--red); color: #fff; border-radius: 9px; font-size: 11px; font-weight: 700;
  line-height: 18px; text-align: center; }
/* hidden özniteliği display kuralına yenilmesin: okunmamış yokken rozet GÖRÜNMEZ */
.notif-badge[hidden] { display: none; }
.notif-list { max-height: 60vh; overflow-y: auto; display: flex; flex-direction: column; gap: 6px; }
.notif-item { display: flex; align-items: flex-start; gap: 8px; padding: 10px 12px;
  border: 1px solid var(--border, #dde3ea); border-radius: 8px; cursor: pointer; background: #fff; }
.notif-item:hover { background: var(--blue-bg); }
.notif-unread { border-left: 4px solid var(--accent); background: #f3f8ff; }
.notif-main { flex: 1; min-width: 0; }
.notif-title { font-weight: 600; }
.notif-body { color: #3a4250; font-size: 13px; margin-top: 2px; word-break: break-word; }
.notif-time { margin-top: 4px; }
.notif-dot { width: 10px; height: 10px; border-radius: 50%; background: var(--accent); margin-top: 5px; flex: none; }

/* 8D ekibi (D1) */
.team-list { list-style: none; padding: 0; margin: 6px 0 0; display: flex; flex-direction: column; gap: 5px; }
.team-list li { display: flex; align-items: center; gap: 8px; }
.team-role { display: inline-block; min-width: 88px; text-align: center; font-size: 12px; font-weight: 700;
  padding: 2px 8px; border-radius: 10px; }
.team-champion { background: #fdeede; color: #9a5b00; }
.team-leader { background: var(--blue-bg, #e7f0fb); color: var(--accent, var(--accent-2)); }
.team-member { background: #eef1f4; color: #46505c; }
.team-row { display: flex; gap: 8px; align-items: center; margin-bottom: 6px; }
.team-row .tm-user { flex: 1; min-width: 0; }
.team-row .tm-role { width: 132px; flex: none; }

/* Organizasyon Şeması */
.org-wrap { overflow-x: auto; padding: 14px 4px; }
.org-tree { display: inline-block; min-width: 100%; text-align: center; }
.org-tree ul { padding-top: 20px; position: relative; display: flex; justify-content: center; list-style: none; margin: 0; }
.org-tree li { text-align: center; list-style: none; position: relative; padding: 20px 10px 0; }
.org-tree li::before, .org-tree li::after { content: ''; position: absolute; top: 0; right: 50%;
  border-top: 2px solid var(--line); width: 50%; height: 20px; }
.org-tree li::after { right: auto; left: 50%; border-left: 2px solid var(--line); }
.org-tree li:only-child::after, .org-tree li:only-child::before { display: none; }
.org-tree li:only-child { padding-top: 0; }
.org-tree li:first-child::before, .org-tree li:last-child::after { border: 0 none; }
.org-tree li:last-child::before { border-right: 2px solid var(--line); border-radius: 0 6px 0 0; }
.org-tree li:first-child::after { border-radius: 6px 0 0 0; }
.org-tree ul ul::before { content: ''; position: absolute; top: 0; left: 50%;
  border-left: 2px solid var(--line); width: 0; height: 20px; }
.org-node { position: relative; display: inline-block; border: 1.5px solid var(--navy); border-radius: 9px;
  padding: 9px 14px; background: #fff; min-width: 140px; max-width: 220px; box-shadow: 0 1px 5px rgba(0,0,0,.08); }
.org-node .on-name { font-weight: 700; color: var(--navy); }
.org-node .on-title { font-size: 12px; color: #45596e; margin-top: 1px; }
.org-node .on-dept { font-size: 11px; color: #7a8a99; margin-top: 2px; }
.org-node .on-actions { position: absolute; top: -10px; right: -8px; display: none; gap: 2px; }
.org-node:hover .on-actions { display: flex; }
.on-btn { width: 24px; height: 24px; border-radius: 50%; border: 1px solid var(--line);
  background: #fff; cursor: pointer; font-size: 12px; line-height: 1; padding: 0; box-shadow: 0 1px 3px rgba(0,0,0,.15); }
.on-btn:hover { background: var(--blue-bg); }

/* ---- Organizasyon: tıklanabilir kutu → kişi kartı ---- */
.org-click { cursor: pointer; }
.org-click:hover { box-shadow: 0 2px 10px rgba(43, 47, 54, .22); }

/* ---- Kart ızgarası (Öğrenilen Dersler) ---- */
.cl-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 14px; }
.cl-card { display: flex; flex-direction: column; gap: 6px; }
.cl-card-head { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.cl-item-row { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 6px 10px; border-bottom: 1px solid var(--line); }
.b-ok-c { background: #def2e4; color: #1c7a40; }
.b-late-c { background: #fdeeda; color: #9a6210; }
.b-miss-c { background: #fbdcdc; color: #a02020; }
.b-open-c { background: #EBEEF3; color: var(--info); }

/* ---- Organizasyon: kişi fotoğrafları ---- */
.org-node .on-photo { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; display: block; margin: 0 auto 5px; border: 1.5px solid var(--line); }
.on-ph-init { background: #ECEAE6; color: var(--navy); font-weight: 800; font-size: 15px; line-height: 41px; text-align: center; }
.on-photo-lg { width: 72px; height: 72px; line-height: 69px; font-size: 22px; margin: 0; }
.org-photo-row { display: flex; gap: 12px; align-items: center; border: 1px dashed var(--line); border-radius: 8px; padding: 8px 10px; }
.org-ctx { opacity: .55; }
.org-ctx .on-name::after { content: " ·"; color: transparent; }
#org-dept { padding: 8px 10px; border-radius: 8px; border: 1px solid var(--line); font: inherit; }

/* ---- Menü grupları (Yönetim → Menü Grupları) — tıklayınca açılır/kapanır ---- */
.nav-grp { margin: 12px 2px 3px; padding: 0 10px; font-size: 10.5px; font-weight: 800; letter-spacing: .09em;
  text-transform: uppercase; color: rgba(255,255,255,.45);
  background: none; border: 0; width: calc(100% - 4px); text-align: left; cursor: pointer;
  display: flex; align-items: center; justify-content: space-between; font-family: inherit; }
.nav-grp:hover { color: rgba(255,255,255,.75); }
.nav-arrow { font-size: 10px; transition: transform .18s; }
.nav-grp-box.closed .nav-arrow { transform: rotate(-90deg); }
.nav-grp-items { display: flex; flex-direction: column; gap: 2px; overflow: hidden; }
.nav-grp-box.closed .nav-grp-items { display: none; }
.side-nav .nav-grp + a { margin-top: 0; }
.grp-box { margin: 8px 0; padding: 10px 12px; }
.grp-head { display: flex; justify-content: space-between; gap: 8px; margin-bottom: 8px; }
.grp-title { font-weight: 700; flex: 1; max-width: 320px; }
.grp-mods { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 4px; }
.notif-dev-toggle { padding: 6px 8px; margin-bottom: 8px; background: var(--panel-2);
  border-radius: 8px; font-size: 12.5px; display: flex; gap: 8px; align-items: flex-start; }

/* ---- Yaz-ara-seç + etiket (chip) seçici (Eylem Planı sorumluları vb.) ---- */
.pick-box { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; border: 1px solid var(--line);
  border-radius: 8px; padding: 6px 8px; background: var(--panel); cursor: text; }
.pick-box:focus-within { border-color: var(--navy); box-shadow: 0 0 0 2px rgba(43, 47, 54,.08); }
.pick-box input { border: none !important; outline: none; flex: 1 1 140px; min-width: 140px;
  padding: 4px 2px; background: transparent; box-shadow: none !important; }
.pick-box #pt-chips, .pick-box .pick-chips { display: contents; }
/* Ortak çoklu seçicide chip içindeki küçük görev/not kutusu (Değişiklik onaya gönder) */
.pick-chip .chip-note { flex: 0 1 auto !important; min-width: 90px !important; max-width: 150px;
  border: 1px solid rgba(43, 47, 54,.25) !important; border-radius: 6px; background: #fff;
  font-size: 11.5px; font-weight: 500; padding: 2px 6px !important; }
.pick-chip { display: inline-flex; align-items: center; gap: 5px; background: #ECEAE6; color: var(--navy);
  border-radius: 14px; padding: 3px 6px 3px 10px; font-size: 12.5px; font-weight: 600; white-space: nowrap; }
.pick-chip.primary { background: var(--navy); color: #fff; }
.pick-chip button { border: none; background: rgba(0,0,0,.14); color: inherit; width: 17px; height: 17px;
  line-height: 1; border-radius: 50%; cursor: pointer; font-size: 12px; padding: 0; }
.pick-chip.primary button { background: rgba(255,255,255,.28); }
.part-hint { min-height: 16px; margin-top: 3px; }

/* ==========================================================================
   ARAYÜZ CİLASI (ui-ux-pro-max rehberiyle gözden geçirme, 2026-07-23)
   Marka/renk kimliği KORUNDU; yalnız geri bildirim, derinlik, okunabilirlik
   ve erişilebilirlik iyileştirmeleri. Tümü eklemeli — düzen değişmez.
   ========================================================================== */

/* Tıklanabilir her şeyde imleç + belirgin ama taşkın olmayan hover geri bildirimi */
.rowlink, .tab, .nav-grp, .sum-group summary, .pt-sec summary,
.qos-overview .qos-cell-edit, label.check-line, .pick-chip button { cursor: pointer; }
.table-hover tbody tr { transition: background .12s ease; }
.table-hover tbody tr:hover { background: #eef4fb; }
.table-dense tbody tr:hover { background: #F1F0ED; }

/* Panel ve tablolarda yumuşak derinlik */
.panel { transition: box-shadow .15s ease; }
.table thead th { position: relative; }
.table tbody tr { border-bottom: 1px solid #edf1f6; }

/* Butonlarda dokunsal his: basınca hafif çökme, birincilde hover'da hafif yükselme */
.btn:active { transform: translateY(1px); }
.btn-primary:hover { box-shadow: 0 3px 10px rgba(200, 81, 31, .3); }

/* Klavye erişilebilirliği: yalnız klavyeyle gezinirken görünür odak halkası */
.btn:focus-visible, a:focus-visible, .tab:focus-visible, .nav-grp:focus-visible,
input[type="checkbox"]:focus-visible {
  outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 6px;
}
.side-nav a:focus-visible { outline-color: #fff; }

/* Sekmeler: aktif geçişi yumuşat, hover'da his ver */
.tab { transition: color .15s ease, border-color .15s ease, background .15s ease; }
.tab:hover { background: #f2f6fb; }

/* Modallar: 160ms giriş animasyonu + arka planda hafif bulanıklık (derinlik) */
.modal-backdrop { animation: mbFade .16s ease; backdrop-filter: blur(2px); }
.modal { animation: mIn .18s cubic-bezier(.2, .8, .3, 1); }
@keyframes mbFade { from { opacity: 0; } to { opacity: 1; } }
@keyframes mIn { from { opacity: 0; transform: translateY(10px) scale(.98); } to { opacity: 1; transform: none; } }

/* Giriş kartı: tek seferlik zarif giriş */
.login-card { animation: mIn .3s cubic-bezier(.2, .8, .3, 1); }

/* Boş durumlar: daha davetkâr */
.empty { padding: 44px 20px; text-align: center; color: var(--muted); font-size: 14.5px;
  background: var(--panel); border: 1px dashed var(--line); border-radius: var(--radius); }

/* İçerik alanı ince kaydırma çubuğu (sol menüyle uyumlu) */
.content { scrollbar-width: thin; scrollbar-color: #c3cfdd transparent; }
.content ::-webkit-scrollbar { width: 8px; height: 8px; }
.content ::-webkit-scrollbar-thumb { background: #c3cfdd; border-radius: 4px; }
.content ::-webkit-scrollbar-thumb:hover { background: #a9b9cb; }
.content ::-webkit-scrollbar-track { background: transparent; }

/* Sayfa başlığı ritmi */
.page-head h1 { letter-spacing: -.01em; }
.page-head .muted { max-width: 860px; }

/* Yükleniyor durumu: sözcük yerine sakin nabız */
.loading { animation: pulse 1.2s ease infinite; }
@keyframes pulse { 0%, 100% { opacity: .55; } 50% { opacity: 1; } }

/* ---------- Ana sayfa: şişirme kalıplama (blow molding) animasyonu ----------
   Başlık, hızlı işlem düğmeleri ve animasyon TEK BİR KARŞILAMA ŞERİDİ içinde
   durur. Önceden başlık solda, animasyon sağ üstte kalıyor, aradaki geniş
   boşluk "düzen bozulmuş" gibi duruyordu (kullanıcının uyarısı). Artık ortak
   bir kart çerçevesi ikisini bağlar ve aradaki boşluğu düğmeler doldurur;
   üstelik ekranda bir satır daha az yer kaplar. */
.dash-hero {
  align-items: center; gap: 20px; padding: 14px 16px; margin-bottom: 18px;
  border: 1px solid var(--line); border-radius: var(--radius);
  background: var(--panel); box-shadow: var(--shadow);
}
.dash-hero h1 { margin-bottom: 4px; }
.dash-hero .quick-row { margin: 12px 0 2px; }
/* Animasyon kutusu: koyu zeminli sahneyi yuvarlatıp "ekran" gibi çerçeveler.
   Başlığın sağında durur; dar ekranda 260 px'ten aşağı DARALIR, 960 px altında
   tamamen gizlenir → başlık satırı hiç bölünmez. */
.dash-anim {
  background: #071018; border: 1px solid var(--line); border-radius: 8px;
  padding: 0; overflow: hidden; flex: 0 1 260px; min-width: 0; position: relative;
  aspect-ratio: 16 / 9; box-shadow: 0 6px 16px rgba(16, 33, 54, .16);
}
/* Kutu DARALABİLİR olmalı: .page-head sarmalı bir flex kapsayıcıdır ve satır
   kırılması flex-shrink'ten ÖNCE hesaplanır — sabit genişlikte kutu, başlığı
   1040-1190 px arasında alt satıra itiyordu (1024x768 ofis ekranı ve %125
   yakınlaştırma tam bu banda düşüyor). Başlık esner, kutu 260 px'i aşmadan
   daralır → başlık tek satırda kalır. */
.dash-hero > div:first-child { flex: 1 1 240px; min-width: 0; }
/* Giriş ekranındaki gibi: görüntünün hiçbir yeri kesilmez (contain). Kutu
   16:9 olduğu için şerit oluşmaz; oluşursa videonun kenar rengiyle dolar. */
.dash-loop { position: absolute; left: 0; top: 0; display: block;
  width: 100%; height: 100%; object-fit: contain;
  background: linear-gradient(180deg, #f3f0ef 0%, #f3f0ef 100%); }
/* 960 px altında tamamen gizlenir: bu genişlikten sonra kutu .page-head'i ikinci
   satıra itiyor ve başlık bölünüyordu (dekoratif öğe düzeni bozmamalı). */
@media (max-width: 960px) {
  .dash-anim { display: none; }
  .dash-hero { padding: 0; border: 0; background: none; box-shadow: none; }
}

/* Ana sayfa kartları: yumuşak sıralı giriş (backwards: bitince hover davranışı bozulmaz) */
.stat-grid .stat-card { animation: cardIn .4s ease backwards; }
.stat-grid .stat-card:nth-child(2) { animation-delay: .05s; }
.stat-grid .stat-card:nth-child(3) { animation-delay: .1s; }
.stat-grid .stat-card:nth-child(4) { animation-delay: .15s; }
.stat-grid .stat-card:nth-child(5) { animation-delay: .2s; }
.stat-grid .stat-card:nth-child(6) { animation-delay: .25s; }
.stat-grid .stat-card:nth-child(7) { animation-delay: .3s; }
@keyframes cardIn { from { opacity: 0; transform: translateY(8px); } }

/* Hareket azaltma tercihi olan kullanıcılara saygı (erişilebilirlik) */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
  /* Tanıtım videosu kutusu gizlenmez — hareketsiz ama anlamlı bir görsel kalır. */
}

/* ==========================================================================
   VIP CİLA (2026-07-28)
   İlke: bu bir "Operate" yüzeyi — araç, görevin içinde kaybolur. Marka ve
   düzen DEĞİŞMEZ; yalnız derinlik, tipografi, geri bildirim ve durum bildiren
   mikro hareket incelenir. Tümü eklemeli — önceki kurallar bilinçli ezilir.
   ========================================================================== */

:root {
  /* Hızlı başlayıp yumuşak biten eğri: giriş/etkileşim hareketlerinin tümünde */
  --ease: cubic-bezier(.23, 1, .32, 1);
  /* Katmanlı gölge: 1px halka + iki yumuşak derinlik ("pahalı" his, bağırmaz) */
  --shadow: 0 0 0 1px rgba(30, 33, 38, .04), 0 1px 2px -1px rgba(30, 33, 38, .06),
            0 4px 12px -2px rgba(30, 33, 38, .08);
  --shadow-lift: 0 0 0 1px rgba(30, 33, 38, .05), 0 4px 10px -2px rgba(30, 33, 38, .10),
                 0 12px 28px -6px rgba(30, 33, 38, .14);
}

/* --- Tipografi incelikleri --- */
body { -webkit-font-smoothing: antialiased; }
h1, h2, h3 { text-wrap: balance; }
p { text-wrap: pretty; }
h1 { font-weight: 700; }
::selection { background: rgba(200, 81, 31, .22); }

/* Dinamik sayılar: rakamlar eş genişlikte — değişince zıplamaz, alt alta hizalanır */
.stat-num, .stat-sub, .yis-card-num, .health-value, .table .num,
.qos-overview td, .pagination, .notif-badge, .badge, .hash {
  font-variant-numeric: tabular-nums;
}

/* --- Geçişler: "hepsi" yerine adlandırılmış özellikler --- */
.btn {
  transition: background .15s var(--ease), border-color .15s var(--ease),
              box-shadow .18s var(--ease), color .15s var(--ease), transform .1s ease;
}
.btn:active:not(:disabled) { transform: translateY(.5px) scale(.98); }
.stat-card { transition: transform .18s var(--ease), box-shadow .18s var(--ease); }
.stat-card:hover { box-shadow: var(--shadow-lift); }
.rowlink, .table-hover tbody tr { transition: background .12s ease; }

/* Tıklanabilir kartlar aynı dili konuşsun: hafif yüksel + katmanlı gölge */
.yis-card, .op-doc-card, .kpi-card { transition: transform .18s var(--ease), box-shadow .18s var(--ease); }
.yis-card:hover { transform: translateY(-1px); box-shadow: var(--shadow-lift); }
.op-doc-card:hover { box-shadow: var(--shadow-lift); }

/* --- Form: girdiler hafif "çukur" (içine yazılır hissi), odakta beyaza döner --- */
input:not([type=checkbox]):not([type=radio]):not([type=file]), select, textarea {
  background: #fafcfe;
  transition: border-color .15s var(--ease), box-shadow .15s var(--ease), background .15s var(--ease);
}
input:focus, select:focus, textarea:focus { background: #fff; }
.pick-box input { background: transparent; }   /* çip kutusundaki iç girdi şeffaf kalır */

/* İşaretlenince minik onay sıçraması (durum bildirir, süslemez) */
input[type="checkbox"]:checked { animation: checkPop .18s var(--ease); }
@keyframes checkPop { 50% { transform: scale(1.3); } }

/* --- Sol menü: mikro dokunuşlar --- */
.side-nav a { transition: background .15s var(--ease), color .15s var(--ease), transform .15s var(--ease); }
.side-nav a:hover { transform: translateX(2px); }
.sidebar.collapsed .side-nav a:hover { transform: none; }  /* dar rayda kaymasın */
.side-nav a.active { box-shadow: 0 2px 8px rgba(200, 81, 31, .35), inset 0 1px 0 rgba(255, 255, 255, .18); }
.side-brand { position: relative; }
.side-brand::after {
  content: ''; position: absolute; left: 12px; right: 12px; bottom: 0; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .16), transparent);
}
.avatar { background: linear-gradient(135deg, var(--accent), var(--accent-2)); box-shadow: 0 0 0 2px rgba(255, 255, 255, .12); }

/* --- Giriş ekranı: tek "vay" anı — lacivert fonda ağır ağır süzülen ışık --- */
.login-wrap { position: relative; overflow: hidden; }
.login-wrap::before, .login-wrap::after {
  content: ''; position: absolute; width: 520px; height: 520px; border-radius: 50%;
  filter: blur(90px); opacity: .32; pointer-events: none;
}
.login-wrap::before { background: var(--accent); top: -180px; left: -120px; animation: aur1 21s ease-in-out infinite alternate; }
.login-wrap::after { background: var(--navy-2); bottom: -200px; right: -140px; animation: aur2 26s ease-in-out infinite alternate; }
@keyframes aur1 { to { transform: translate(60px, 40px) scale(1.12); } }
@keyframes aur2 { to { transform: translate(-50px, -30px) scale(1.08); } }
.login-card { position: relative; z-index: 1; box-shadow: 0 0 0 1px rgba(255, 255, 255, .07), 0 18px 60px rgba(0, 0, 0, .4); }

/* --- Görünüm başlığı: tek, kısa varış hareketi (koreografi değil) --- */
.page-head { animation: viewIn .22s var(--ease) backwards; }
@keyframes viewIn { from { opacity: 0; transform: translateY(4px); } }

/* --- Tablo: başlıkta sessiz zemin, satırda yumuşak geçiş --- */
.table thead th { background: #fafcfe; letter-spacing: .05em; }

/* --- Modal & toast: aynı eğri, tutarlı his --- */
.modal { animation: mIn .22s var(--ease); }
.toast { animation: slidein .25s var(--ease); box-shadow: 0 0 0 1px rgba(255, 255, 255, .08), 0 10px 30px rgba(0, 0, 0, .25); }

/* --- Sürükle-bırak: davet eden ikon (ara sıra görülen yüzeyde küçük keyif) --- */
.dropzone { transition: border-color .2s var(--ease), background .2s var(--ease); }
.dz-icon { animation: dzFloat 3s ease-in-out infinite; }
@keyframes dzFloat { 50% { transform: translateY(-4px); } }

/* --- Bildirim satırları: geçişli geri bildirim --- */
.notif-item { transition: background .15s var(--ease), border-color .15s var(--ease); }

/* --- Rozetler: içten 1px halka — tüm renklerde aynı incelik --- */
.badge { box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .04); }

/* --- Klavye odak halkası: eksik kalan kontrollere de --- */
select:focus-visible, textarea:focus-visible, .chip:focus-visible,
.res-btn:focus-visible, .icon-btn:focus-visible, .side-collapse:focus-visible {
  outline: 2px solid var(--accent); outline-offset: 2px;
}

/* ==========================================================================
   BÜYÜK PAKET (2026-07-28): Ana Sayfa 2.0 · Ctrl+K paleti · Kalite Takvimi ·
   koyu tema · termin pili · onay rozeti
   ========================================================================== */

/* --- Ana Sayfa 2.0 --- */
.quick-row { display: flex; gap: 10px; margin: 0 0 18px; flex-wrap: wrap; }
.quick-row .btn { box-shadow: var(--shadow); }
.pal-hint { font-weight: 500; font-size: 11px; color: var(--muted); background: #EEEDEA;
  border-radius: 5px; padding: 1px 6px; margin-left: 4px; }
.spark { display: block; margin-top: 8px; }
.stat-delta { font-size: 11.5px; font-weight: 700; margin-left: 6px; vertical-align: 3px; }
.d-up { color: var(--green); }
.d-down { color: var(--red); }
.upc { display: flex; flex-direction: column; gap: 8px; }
.upc-item { display: flex; align-items: center; gap: 12px; padding: 9px 12px;
  border: 1px solid var(--line); border-radius: 9px; background: var(--panel-2); color: var(--text); }
.upc-item:hover { text-decoration: none; border-color: #CFCDC8; }
.upc-date { width: 52px; text-align: center; background: var(--blue-bg); color: var(--info);
  border-radius: 8px; padding: 4px 0; font-weight: 750; line-height: 1.15; flex: none;
  font-variant-numeric: tabular-nums; }
.upc-date small { display: block; font-weight: 600; font-size: 10px; letter-spacing: .06em; }
.upc-item.u-warn .upc-date { background: var(--orange-bg); color: var(--orange); }
.upc-item.u-red .upc-date { background: var(--red-bg); color: var(--red); }
.upc-tx { min-width: 0; }
.recent { display: flex; flex-direction: column; }
.recent a { display: flex; gap: 10px; align-items: center; padding: 7px 6px; border-radius: 8px; color: var(--text); }
.recent a:hover { background: #f2f7fd; text-decoration: none; }
.recent .file-ic { width: 30px; height: 30px; font-size: 9px; }

/* --- Termin pili (DÖF/8D listeleri): tarih yerine insan dili --- */
.due-pill { display: inline-block; font-size: 12px; font-weight: 700; border-radius: 12px;
  padding: 2px 9px; white-space: nowrap; font-variant-numeric: tabular-nums; }
.due-late { background: var(--red-bg); color: var(--red); }
.due-soon { background: var(--orange-bg); color: var(--orange); }
.due-ok { background: #EEEDEA; color: var(--muted); font-weight: 600; }

/* --- Sol menü: Bekleyen Onaylar sayı rozeti --- */
.nav-badge { margin-left: auto; }
.sidebar.collapsed .nav-badge { display: none; }

/* --- Ctrl+K hızlı arama paleti --- */
.pal-back { position: fixed; inset: 0; background: rgba(20, 22, 26, .45); z-index: 300;
  display: flex; align-items: flex-start; justify-content: center; padding: 11vh 16px 16px;
  backdrop-filter: blur(2px); }
.pal { width: 640px; max-width: 100%; background: var(--panel); border-radius: 14px; overflow: hidden;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, .12), 0 30px 80px rgba(0, 0, 0, .4);
  animation: mIn .18s var(--ease); }
.pal-in { display: flex; align-items: center; gap: 10px; padding: 14px 18px; border-bottom: 1px solid var(--line); }
.pal-in input { border: 0 !important; outline: none; font-size: 16px; flex: 1;
  box-shadow: none !important; padding: 0; background: transparent; }
.pal-list { max-height: 52vh; overflow-y: auto; padding-bottom: 6px; }
.pal-grp { padding: 8px 12px 2px; font-size: 10.5px; font-weight: 800; letter-spacing: .08em;
  color: var(--muted); text-transform: uppercase; }
.pal-item { display: flex; align-items: center; gap: 11px; padding: 8px 14px; border-radius: 8px;
  margin: 0 6px; cursor: pointer; }
.pal-item:hover, .pal-item.sel { background: var(--blue-bg); }
.pal-item .file-ic { width: 28px; height: 28px; font-size: 8.5px; }
.pal-tx { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pal-tx mark { background: #ffef9c; border-radius: 3px; padding: 0 1px; }
.pal-ic { width: 28px; height: 28px; border-radius: 8px; background: #EEEDEA; display: inline-flex;
  align-items: center; justify-content: center; font-size: 14px; flex: none; }
.pal-cmd { background: var(--blue-bg); color: var(--accent-2); font-weight: 800; }
.pal-dof { background: var(--red-bg); color: var(--red); font-size: 9px; font-weight: 800; }
.pal-k { font-size: 11px; color: var(--muted); background: #EEEDEA; border-radius: 5px;
  padding: 1px 7px; white-space: nowrap; }
.pal-empty { padding: 26px; text-align: center; color: var(--muted); }
.pal-foot { display: flex; gap: 16px; padding: 9px 16px; border-top: 1px solid var(--line);
  font-size: 11.5px; color: var(--muted); background: var(--panel-2, #fafcfe); }
.pal-r { margin-left: auto; }
kbd { background: #EEEDEA; border: 1px solid #d7dfe9; border-radius: 4px; padding: 0 5px;
  font-family: inherit; font-size: 11px; }

/* --- Kalite Takvimi --- */
.cal-nav { display: flex; gap: 6px; align-items: center; }
.cal-title { min-width: 130px; text-align: center; }
.cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 6px; }
/* Hafta numarası kolonu (ISO hafta — takvimin solunda dar şerit) */
.cal-grid.cal-weeks { grid-template-columns: 42px repeat(7, 1fr); }
.cal-wk { display: flex; align-items: flex-start; justify-content: center; padding-top: 8px;
  font-size: 11px; font-weight: 800; color: #8B8E95; background: #F1F0ED;
  border: 1px solid var(--line); border-radius: 10px; font-variant-numeric: tabular-nums; }
html[data-theme="dark"] .cal-wk { background: #2B2F36; color: #9A9CA3; }
.cal-dow { font-size: 10.5px; font-weight: 800; letter-spacing: .07em; color: var(--muted);
  text-transform: uppercase; padding: 4px 8px; }
.cal-day { min-height: 92px; background: var(--panel); border: 1px solid var(--line);
  border-radius: 10px; padding: 6px 8px; box-shadow: var(--shadow); }
.cal-day.dim { background: transparent; border-style: dashed; box-shadow: none; opacity: .45; }
.cal-day.today { border-color: var(--accent); box-shadow: 0 0 0 2px rgba(200, 81, 31, .18); }
.cal-no { font-size: 12px; font-weight: 700; color: var(--muted); }
.cal-day.today .cal-no { color: var(--accent); }
.ev { display: block; font-size: 10.8px; font-weight: 650; border-radius: 6px; padding: 2px 7px;
  margin-top: 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
a.ev:hover { text-decoration: none; filter: brightness(.95); }
.ev-gg, i.ev-gg { background: var(--orange-bg); color: #8a5a10; }
.ev-dn, i.ev-dn { background: #f0ebfa; color: #6b46c1; }
.ev-df, i.ev-df { background: var(--red-bg); color: #97282f; }
.ev-ys, i.ev-ys { background: var(--blue-bg); color: var(--info); }
.ev-kl, i.ev-kl { background: #E1F0EE; color: #1F6F6B; }
.ev-ms, i.ev-ms { background: #E1F3F4; color: #0A666D; }
.ev-sp, i.ev-sp { background: #E9ECFB; color: #2E3F8F; }
.ev-fm, i.ev-fm { background: #FBEDE6; color: #A6421A; }
.ev-more { background: #EEEDEA; color: var(--muted); cursor: help; }
.cal-leg { display: flex; gap: 16px; margin: 12px 2px 0; font-size: 12px; color: var(--muted); flex-wrap: wrap; }
.cal-leg i { display: inline-block; width: 11px; height: 11px; border-radius: 4px;
  margin-right: 5px; vertical-align: -1px; }
@media (max-width: 900px) {
  .cal-grid { gap: 3px; }
  .cal-day { min-height: 64px; padding: 4px 5px; }
  .ev { font-size: 9.5px; }
}
@media print { .cal-nav { display: none !important; } .cal-day { box-shadow: none; } }

/* --- KOYU TEMA: Profil'den seçilir, bu tarayıcıda saklanır.
       Aynı hiyerarşi, ters değerler; tek renk tonu, yalnız açıklık kayar. --- */
html[data-theme="dark"] {
  color-scheme: dark;   /* yerel denetimler (onay kutusu, dosya seç, tarih) de koyu çizilir */
  --bg: #17191D; --panel: #22252B; --panel-2: #1C1F24; --line: rgba(255, 255, 255, .09);
  --text: #E6E5E2; --muted: #9A9CA3; --navy: #E6E5E2; --info: #B7C0D0;
  --accent: #E0693A; --accent-2: #C8511F;
  --blue-bg: rgba(140, 150, 170, .2); --green-bg: rgba(31, 157, 85, .2);
  --red-bg: rgba(214, 69, 69, .2); --orange-bg: rgba(199, 123, 20, .22);
  --shadow: 0 0 0 1px rgba(255, 255, 255, .07);
  --shadow-lift: 0 0 0 1px rgba(255, 255, 255, .13);
  --line-2: rgba(255, 255, 255, .16);
  --green-line: rgba(31, 157, 85, .4); --red-line: rgba(214, 69, 69, .4); --orange-line: rgba(199, 123, 20, .42);
  --accent-rgb: 224 105 58; --accent-canli: #F08A5D; --mod-wash: rgba(224, 105, 58, .16);
  /* Durum renkleri koyu fonda okunur, ama parlamayan tonlar */
  --green: #5BBF86; --red: #E57373; --orange: #D9A441;
}
html[data-theme="dark"] .mod-msa { --mod: #1e9fa9; --mod-2: #17868f; --mod-canli: #2fc0cb; --mod-wash: rgba(30, 159, 169, .16); --mod-rgb: 30 159 169; }
html[data-theme="dark"] .mod-spc { --mod: #7d90ee; --mod-2: #5f74dd; --mod-canli: #98a9f5; --mod-wash: rgba(125, 144, 238, .16); --mod-rgb: 125 144 238; }
html[data-theme="dark"] .sidebar { background: linear-gradient(180deg, #1C1F24 0%, #121417 100%); }
html[data-theme="dark"] .toast { background: #2B2F36; }
html[data-theme="dark"] .pick-chip { background: #3A3F48; color: #E6E5E2; }
html[data-theme="dark"] .pick-chip.primary { background: var(--accent); }
html[data-theme="dark"] .table thead th { background: rgba(255, 255, 255, .03); }
html[data-theme="dark"] .table td { border-color: rgba(255, 255, 255, .06); }
html[data-theme="dark"] .table tbody tr { border-color: rgba(255, 255, 255, .06); }
html[data-theme="dark"] .table-hover tbody tr:hover, html[data-theme="dark"] .rowlink:hover,
html[data-theme="dark"] .table-dense tbody tr:hover { background: rgba(200, 81, 31, .1); }
html[data-theme="dark"] input:not([type=checkbox]):not([type=radio]):not([type=file]),
html[data-theme="dark"] select, html[data-theme="dark"] textarea { background: #17191D; color: var(--text); }
html[data-theme="dark"] input:focus, html[data-theme="dark"] select:focus,
html[data-theme="dark"] textarea:focus { background: #121417; }
html[data-theme="dark"] .btn { background: #2B2F36; border-color: rgba(255, 255, 255, .13); color: #E6E5E2; }
html[data-theme="dark"] .btn:hover { background: #363A42; border-color: rgba(255, 255, 255, .2); }
html[data-theme="dark"] .btn-primary { background: var(--accent); border-color: var(--accent); color: #fff; }
html[data-theme="dark"] .btn-primary:hover { background: var(--accent-2); }
html[data-theme="dark"] .btn-danger { background: #B84545; border-color: #B84545; color: #fff; }
html[data-theme="dark"] .dropzone { background: #1C1F24; border-color: rgba(255, 255, 255, .18); }
html[data-theme="dark"] code, html[data-theme="dark"] kbd, html[data-theme="dark"] .pal-ic,
html[data-theme="dark"] .pal-k, html[data-theme="dark"] .pal-hint,
html[data-theme="dark"] .ev-more, html[data-theme="dark"] .due-ok,
html[data-theme="dark"] .badge-plain, html[data-theme="dark"] .badge-ro {
  background: rgba(255, 255, 255, .08); color: #B5B7BD; border-color: rgba(255, 255, 255, .12); }
html[data-theme="dark"] .chip { background: #2B2F36; color: #E6E5E2; border-color: rgba(255, 255, 255, .15); }
html[data-theme="dark"] .step, html[data-theme="dark"] .ishi-box,
html[data-theme="dark"] .notif-item,
html[data-theme="dark"] .qos-acc-item, html[data-theme="dark"] .grp-box,
html[data-theme="dark"] .yis-card, html[data-theme="dark"] .health-card,
html[data-theme="dark"] .op-doc-card, html[data-theme="dark"] .org-node,
html[data-theme="dark"] .kl-kunye-satir .v code { background: var(--panel-2); }
html[data-theme="dark"] .notif-unread { background: rgba(200, 81, 31, .12); }
html[data-theme="dark"] .recent a:hover { background: rgba(200, 81, 31, .1); }
html[data-theme="dark"] .side-collapse { background: #2B2F36; color: #E6E5E2; border-color: rgba(255, 255, 255, .18); }
/* Koyu temada da bileşenin kendi koyu zemini geçerli — kutu rengi sabit kalır
   (bileşen içindeki sahne #071018 zemine göre çizilmiştir). */
html[data-theme="dark"] .yis-card-num, html[data-theme="dark"] .health-label { color: #E6E5E2; }
html[data-theme="dark"] .tab:hover { background: rgba(255, 255, 255, .05); }
html[data-theme="dark"] .content, html[data-theme="dark"] .side-nav { scrollbar-color: #4A4E56 transparent; }
html[data-theme="dark"] .content ::-webkit-scrollbar-thumb { background: #4A4E56; }
/* Renkli rozetler: koyu fonda YUMUŞAK ton (şeffaf renk zemin + açık yazı).
   Eskiden açık renkli rozetlere parlatma filtresi (brightness ×1,55) uygulanıyordu;
   açık pastel zemin daha da parlayıp göz alıyordu ("cırtlak", 2026-09-26).
   Artık her renk ailesi aşağıdaki "KOYU TEMA — renk aileleri" bölümünde
   açıkça tanımlı. Yalnız .ia-cat rengi JS'ten satır içi geldiği için hafif
   aydınlatma ile kalır. */
html[data-theme="dark"] .ia-cat { filter: brightness(1.35) saturate(.9); }
/* Yazdırırken koyu tema devre dışı: kâğıt her zaman açık */
@media print {
  html[data-theme="dark"] { --bg: #fff; --panel: #fff; --panel-2: #F8F7F5; --text: #22252B;
    --muted: #6B6F78; --line: #E2E0DC; --navy: #2B2F36; --shadow: none; }
  html[data-theme="dark"] .mod-msa { --mod: #0d7f86; --mod-wash: #e1f3f4; --mod-rgb: 13 127 134; }
  html[data-theme="dark"] .mod-spc { --mod: #3d52b5; --mod-wash: #e9ecfb; --mod-rgb: 61 82 181; }
}

/* ==========================================================================
   MOBİL (dik telefon, ≤860px): üst bar + soldan kayan çekmece menü.
   Eski "menü üstte yatay yığılır" düzeni tamamen kalktı — kalabalık bitti.
   ========================================================================== */
.mobile-top { display: none; }
.side-backdrop { position: fixed; inset: 0; background: rgba(20, 22, 26, .5);
  z-index: 240; backdrop-filter: blur(2px); }
.side-backdrop[hidden] { display: none; }
body.no-scroll { overflow: hidden; }

@media (max-width: 860px) {
  .shell { display: block; }
  /* Üst bar: marka + menü + zil — çentikli telefonlarda güvenli alana saygı */
  .mobile-top {
    display: flex; align-items: center; gap: 10px; position: sticky; top: 0; z-index: 90;
    background: linear-gradient(90deg, var(--navy-3), var(--navy)); color: #fff;
    padding: 10px 12px; padding-top: calc(10px + env(safe-area-inset-top));
    box-shadow: 0 2px 12px rgba(30, 33, 38, .3);
  }
  .mt-burger, .mt-bell {
    font: inherit; font-size: 19px; background: rgba(255, 255, 255, .1);
    border: 1px solid rgba(255, 255, 255, .16); color: #fff; border-radius: 10px;
    width: 42px; height: 40px; cursor: pointer; position: relative; flex: none;
    display: inline-flex; align-items: center; justify-content: center;
  }
  .mt-burger:active, .mt-bell:active { background: rgba(255, 255, 255, .2); }
  .mt-brand { display: flex; align-items: center; gap: 9px; flex: 1; min-width: 0; }
  .mt-title { font-weight: 750; font-size: 16px; white-space: nowrap;
    overflow: hidden; text-overflow: ellipsis; }
  .mt-bell .notif-badge { position: absolute; top: -5px; right: -5px; margin: 0; }

  /* Kenar çubuğu = soldan kayan çekmece (varsayılan gizli) */
  .sidebar {
    position: fixed; top: 0; left: 0; height: 100dvh; width: min(82vw, 320px);
    z-index: 250; transform: translateX(-105%); transition: transform .25s var(--ease);
    box-shadow: 24px 0 60px rgba(0, 0, 0, .35);
  }
  .sidebar.mobile-open { transform: translateX(0); }
  /* Masaüstünde kaydedilmiş "daraltılmış" tercihi mobili etkilemesin */
  .sidebar.collapsed { width: min(82vw, 320px); }
  .side-nav { flex-direction: column; flex-wrap: nowrap; }
  .side-nav a { padding: 12px; font-size: 14.5px; }
  .side-brand { padding-top: calc(18px + env(safe-area-inset-top)); }

  /* Dokunma konforu */
  .btn { min-height: 38px; }
  .page-head h1 { font-size: 20px; }
  .quick-row .btn { flex: 1 1 44%; }
  .stat-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
  .stat-num { font-size: 24px; }
  .modal-backdrop { padding: 3vh 8px; }
  .pal-back { padding: 6vh 8px 8px; }
  .content { padding-bottom: 46px; }
}
/* Koyu temada mobil üst bar da koyulaşır */
html[data-theme="dark"] .mobile-top { background: linear-gradient(90deg, #121417, #1C1F24); }

/* ==========================================================================
   📸 HIZLI DÖF (Saha Modu): fotoğraf ızgarası, işaretleme tuvali, DÖF galerisi
   ========================================================================== */
.qd-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(88px, 1fr)); gap: 8px; }
.qd-add {
  font: inherit; border: 2px dashed #CFCDC8; background: var(--panel-2); border-radius: 12px;
  min-height: 88px; cursor: pointer; color: var(--accent); font-size: 22px;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px;
  transition: border-color .15s var(--ease), background .15s var(--ease);
}
.qd-add span { font-size: 10.5px; color: var(--muted); line-height: 1.3; text-align: center; }
.qd-add:hover { border-color: var(--accent); background: var(--blue-bg); }
.qd-ph { position: relative; border-radius: 12px; overflow: hidden; border: 1px solid var(--line); }
.qd-ph img { width: 100%; height: 88px; object-fit: cover; display: block; }
.qd-ph-acts { position: absolute; right: 4px; bottom: 4px; display: flex; gap: 4px; }
.qd-ph-acts button { border: 0; border-radius: 7px; width: 27px; height: 27px; cursor: pointer;
  background: rgba(10, 18, 30, .65); color: #fff; font-size: 12px; }
.qd-ph-acts button:hover { background: rgba(10, 18, 30, .85); }
.qd-mark-wrap { overflow: auto; max-height: 62vh; border-radius: 10px; border: 1px solid var(--line); }
#qd-canvas { max-width: 100%; display: block; touch-action: none; cursor: crosshair; }
/* DÖF detayı: fotoğraf ekleri küçük galeri (tıklayınca yeni sekmede büyür) */
.dof-gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(108px, 1fr));
  gap: 8px; margin-bottom: 10px; }
.dof-gallery img { width: 100%; height: 96px; object-fit: cover; border-radius: 10px;
  border: 1px solid var(--line); box-shadow: var(--shadow); display: block;
  transition: transform .15s var(--ease), box-shadow .15s var(--ease); }
.dof-gallery a:hover img { transform: scale(1.03); box-shadow: var(--shadow-lift); }
html[data-theme="dark"] .qd-add { background: #1C1F24; border-color: rgba(255, 255, 255, .2); }

/* ============ İLK KULLANIM TURU + KISAYOL KARTI + BİLDİRİM 2.0 ============ */
.tour-hole { position: fixed; z-index: 3000; border-radius: 12px; pointer-events: none;
  box-shadow: 0 0 0 5px rgba(200, 81, 31, .55), 0 0 0 9999px rgba(15, 32, 51, .58);
  transition: left .28s var(--ease), top .28s var(--ease), width .28s var(--ease), height .28s var(--ease); }
.tour-balon { position: fixed; z-index: 3001; width: 330px; max-width: calc(100vw - 24px);
  background: var(--panel); border-radius: 14px; box-shadow: 0 18px 44px rgba(10, 22, 38, .4);
  padding: 15px 17px; animation: mIn .25s cubic-bezier(.2, .8, .3, 1); }
.tour-balon.tour-orta { left: 50% !important; top: 34% !important; transform: translate(-50%, 0);
  box-shadow: 0 18px 44px rgba(10, 22, 38, .4), 0 0 0 9999px rgba(15, 32, 51, .58); }
.tour-balon b { color: var(--navy); font-size: 13.5px; }
.tour-balon p { font-size: 13px; line-height: 1.55; color: var(--ink, #2a2f36); margin: 6px 0 12px; }
.tour-atla { font-size: 11.5px; color: var(--muted); cursor: pointer; margin-left: auto; }
.tour-atla:hover { text-decoration: underline; }
.tour-noktalar { display: inline-flex; gap: 4px; align-items: center; }
.tour-noktalar i { width: 6px; height: 6px; border-radius: 50%; background: #d5dee9; }
.tour-noktalar i.on { background: var(--accent); }
@media (max-width: 700px) {
  .tour-balon { left: 12px !important; right: 12px; top: auto !important; bottom: 14px; width: auto; transform: none; }
}
html[data-theme="dark"] .tour-balon p { color: #cfdae8; }

.ks-liste { display: flex; flex-direction: column; gap: 2px; }
.ks-sat { display: flex; gap: 14px; align-items: center; padding: 7px 2px; border-bottom: 1px solid var(--line); font-size: 13px; }
.ks-tus { font-family: ui-monospace, monospace; font-size: 12px; font-weight: 700; color: var(--navy);
  background: #EEEDEA; border: 1px solid var(--line); border-radius: 7px; padding: 3px 9px; white-space: nowrap; min-width: 86px; text-align: center; }
html[data-theme="dark"] .ks-tus { background: #2B2F36; color: #cfdae8; }

.notif-filtre { display: flex; gap: 6px; flex-wrap: wrap; margin: 0 0 10px; }
.notif-filtre button { font-size: 11.5px; border: 1px solid var(--line); background: var(--panel);
  border-radius: 16px; padding: 4px 11px; cursor: pointer; color: var(--ink, #2a2f36); }
.notif-filtre button.on { background: var(--navy); color: #fff; border-color: var(--navy); }
.notif-grup { font-size: 10.5px; font-weight: 800; letter-spacing: .1em; color: var(--muted); padding: 10px 2px 4px; }
.notif-say { background: #EEEDEA; color: var(--info); font-size: 10px; font-weight: 800; border-radius: 9px; padding: 1px 7px; vertical-align: 1px; }
html[data-theme="dark"] .notif-say { background: #2B2F36; color: #B7C0D0; }

/* Onay öncesi önizleme (Bekleyen Onaylar → 👁) */
.ap-prev { width: 100%; height: min(72vh, 760px); border: 1px solid var(--line);
  border-radius: 10px; background: #fff; display: block; }

/* Bölüm seçim ızgarası (rapor erişimi / bölüm listeleri) */
.rp-bolum-grup { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 3px 12px; padding: 5px 0; }
.rp-bolum-grup label { display: flex; gap: 7px; align-items: center; font-size: 12.5px; font-weight: 500; cursor: pointer; }

/* ================= Günlük CCAR (sabah toplantısı defteri) ================= */
.gc-bolum-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 12px; }
.gc-bolum-kart { background: var(--panel); border: 1px solid var(--line); border-radius: 12px;
  box-shadow: var(--shadow); padding: 16px 18px; cursor: pointer; transition: box-shadow .15s ease; }
.gc-bolum-kart:hover { box-shadow: 0 4px 16px rgba(30, 33, 38, .14); }
.gc-bolum-ad { font-size: 15px; font-weight: 750; color: var(--navy); margin-bottom: 6px; }
html[data-theme="dark"] .gc-bolum-ad { color: #E6E5E2; }
.gc-bolum-say { display: flex; justify-content: space-between; font-size: 12.5px; }
.gc-bolum-say .kirmizi { color: #d64545; font-weight: 700; }

.gc-kpi { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 10px; margin-bottom: 12px; }
.gc-kpi > div { background: var(--panel); border: 1px solid var(--line); border-radius: 10px; padding: 10px 14px; }
/* Tıklanır KPI kutusu (örn. GECİKEN AÇIK → kayıt listesi) fark edilsin */
.gc-kpi > div.gc-tikla:hover { border-color: var(--accent); box-shadow: 0 2px 10px rgba(16, 33, 54, .14); }
.gc-kpi .e { font-size: 9.5px; font-weight: 800; letter-spacing: .08em; color: var(--muted); }
.gc-kpi .v { font-size: 21px; font-weight: 800; color: var(--navy); }
html[data-theme="dark"] .gc-kpi .v { color: #E6E5E2; }
.gc-kpi .a { font-size: 10.5px; color: var(--muted); }
.gc-iki { display: grid; grid-template-columns: 3fr 2fr; gap: 14px; align-items: start; }
/* Izgara ögesinin varsayılan min-width:auto'su, içindeki geniş içeriğin (kayıt
   satırları, tablolar) kolonu ŞİŞİRMESİNE ve sağdaki formu ekranın dışına
   itmesine yol açıyordu — 1000-1150px arası ekranlarda sayfa yatay kayıyordu
   (2026-08-24'te ölçülüp düzeltildi; kusur bu turdan eskidir). */
.gc-iki > * { min-width: 0; }
@media (max-width: 1150px) { .gc-iki { grid-template-columns: 1fr; } }

.gc-sat { display: grid; grid-template-columns: 68px 1fr 130px 96px 90px auto; gap: 10px; align-items: center;
  padding: 7px 10px; border: 1px solid var(--line); border-radius: 10px; margin-bottom: 6px; background: var(--panel); }
.gc-sat.gec { border-left: 4px solid #d64545; }
.gc-sat .mak { font-weight: 800; font-size: 11.5px; color: var(--navy); background: var(--blue-bg);
  border-radius: 7px; text-align: center; padding: 3px 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
html[data-theme="dark"] .gc-sat .mak { background: #2B2F36; color: #B7C0D0; }
/* Tablo görünümü + hücre düzenleme — koyu tema */
html[data-theme="dark"] .gc-tablo td { border-color: #2a3a4e; }
html[data-theme="dark"] .gc-tablo tbody tr:hover { background: #1a2634; }
html[data-theme="dark"] .gc-tablo .bos { color: #4d5f74; }
html[data-theme="dark"] .gc-tablo .kat { color: #B7C0D0; }
html[data-theme="dark"] .gc-yaz-ipucu { background: var(--navy); border-color: #2f4763; color: #B7C0D0; }
html[data-theme="dark"] .gc-yaz-ipucu span { color: #8fa8c6; }
html[data-theme="dark"] .gc-tablo.gc-yaz td.gc-hcr:hover { background: #1d2f45; }
html[data-theme="dark"] .gc-tablo.gc-yaz td.gc-hcr.sec { background: #1d2f45; }
html[data-theme="dark"] .gc-tablo.gc-yaz td.gc-ac:hover { background: #202d3d; }
html[data-theme="dark"] .gc-tablo .gc-inp { background: #1C1F24; color: #E6E5E2; }
html[data-theme="dark"] .gc-tablo tbody tr.bos td { background: #241f14; }
html[data-theme="dark"] .gc-tablo .gc-bos-not { color: #d9b25f; }
html[data-theme="dark"] .gc-bos-sil { background: #2B2F36; border-color: #5e3a3a; color: #e8a3a3; }
html[data-theme="dark"] .gc-bnz.diger { background: var(--navy); border-color: #2f4763; }
html[data-theme="dark"] .gc-bnz .aks { background: #14251a; color: #9fd6b2; }
html[data-theme="dark"] .gc-suz-serit { background: #241f14; border-color: #5c4a24; color: #e0c68a; }
html[data-theme="dark"] .gc-suz-cip { background: var(--navy); border-color: #4a3d20; }
html[data-theme="dark"] .gc-suz-liste { border-color: #2a3a4e; }
html[data-theme="dark"] .gc-suz-sat:hover { background: #1d2f45; }
html[data-theme="dark"] .gc-onizle { border-color: #2a3a4e; }
html[data-theme="dark"] .gc-onizle .eski { color: #e8a3a3; }
html[data-theme="dark"] .gc-onizle .yeni { color: #8fd9ab; }
@keyframes gcKayitFlasKoyu { 0% { background: #1d5c36; } 100% { background: transparent; } }
html[data-theme="dark"] .gc-tablo td.kayitli { animation-name: gcKayitFlasKoyu; }
.gc-sat .orta { min-width: 0; }
.gc-sat .prob { font-size: 12.5px; line-height: 1.35; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gc-sat .alt { font-size: 10.5px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gc-sat .gec-t { color: #d64545; font-weight: 700; }
.gc-cip { font-size: 10px; font-weight: 800; border-radius: 12px; padding: 2px 8px; color: #fff; text-align: center; white-space: nowrap; }
.gc-islem { display: flex; gap: 4px; justify-content: flex-end; }
.gc-liste-bas { display: flex; justify-content: space-between; gap: 10px; align-items: center; flex-wrap: wrap; margin-bottom: 10px; }
.gc-liste-bas h2 { margin: 0; }

.gc-form label { display: flex; flex-direction: column; gap: 4px; font-size: 12px; font-weight: 600;
  color: var(--navy); margin-bottom: 8px; }
html[data-theme="dark"] .gc-form label { color: #b9c9dc; }
.gc-yanyana { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }

.gc-cubuk { display: flex; align-items: center; gap: 8px; padding: 2.5px 0; }
.gc-cubuk .n { width: 150px; font-size: 11px; text-align: right; font-weight: 600;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex-shrink: 0; }
.gc-cubuk .b { flex: 1; background: var(--bg); border-radius: 4px; height: 13px; }
.gc-cubuk .b i { display: block; height: 100%; border-radius: 4px; min-width: 2px; }
.gc-cubuk .s { width: 40px; font-size: 11px; font-weight: 700; }
.gc-cubuk .s .muted { font-weight: 500; }
/* Aylık akış: açılan/kapatılan çift çubuğu (üst kırmızı, alt yeşil) */
.gc-cubuk .b2 { flex: 1; display: flex; flex-direction: column; gap: 2px; }
.gc-cubuk .b2 i { display: block; height: 6.5px; border-radius: 4px; min-width: 2px; }
/* Haftanın günü dağılımı: dikey mini sütunlar */
.gc-gunler { display: flex; align-items: flex-end; gap: 10px; padding: 6px 4px 0; }
.gc-gun { display: flex; flex-direction: column; align-items: center; gap: 3px; flex: 1; }
.gc-gun i { display: block; width: 100%; max-width: 44px; border-radius: 5px 5px 2px 2px; min-height: 2px; }
.gc-gun b { font-size: 11px; }
.gc-gun span { font-size: 10.5px; color: var(--muted); }
/* Makina × Ay ısı haritası */
.gc-isi { width: 100%; border-collapse: collapse; font-size: 11px; }
.gc-isi th { padding: 3px 4px; font-size: 10.5px; color: var(--muted); text-align: center; }
.gc-isi tbody th { text-align: right; max-width: 110px; overflow: hidden; text-overflow: ellipsis;
  white-space: nowrap; color: var(--navy); }
html[data-theme="dark"] .gc-isi tbody th { color: #b9c9dc; }
.gc-isi td { text-align: center; padding: 3.5px 2px; border: 1px solid var(--line);
  min-width: 26px; font-weight: 600; border-radius: 3px; }
.gc-tekrar { border: 1.5px dashed #e5b7b3; background: #fdf4f3; border-radius: 10px;
  padding: 9px 12px; font-size: 12.5px; margin-bottom: 7px; }
html[data-theme="dark"] .gc-tekrar { background: #2a1d1c; border-color: #7a4b45; }

/* Tıklanabilir analiz ögeleri (makinaya tıkla → Makina Kartı) */
.gc-tikla { cursor: pointer; }
.gc-cubuk.gc-tikla { border-radius: 6px; }
.gc-cubuk.gc-tikla:hover, .gc-tekrar.gc-tikla:hover { background: var(--bg); }
html[data-theme="dark"] .gc-cubuk.gc-tikla:hover { background: #223146; }
.gc-cubuk.gc-tikla:hover .n { text-decoration: underline; }
.gc-isi th.gc-tikla:hover { color: var(--accent); text-decoration: underline; }

/* ⚙ Makina Kartı (analizden makinaya tıklayınca açılan pencere) */
.gc-mk-kpi { display: grid; grid-template-columns: repeat(auto-fit, minmax(104px, 1fr));
  gap: 8px; margin-bottom: 12px; }
.gc-mk-kpi > div { background: var(--bg); border: 1px solid var(--line); border-radius: 10px;
  padding: 8px 10px; text-align: center; }
.gc-mk-kpi b { display: block; font-size: 19px; font-weight: 800; color: var(--navy); }
html[data-theme="dark"] .gc-mk-kpi b { color: #E6E5E2; }
.gc-mk-kpi span { font-size: 10px; color: var(--muted); }
.gc-mk-kpi .kirmizi b { color: #d64545; }
.gc-mk-kpi .turuncu b { color: #c77b14; }
.gc-mk-kpi select { font-size: 15px; font-weight: 800; border: 0; background: transparent; color: inherit; }
.gc-mk-grafik { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-bottom: 8px; }
@media (max-width: 760px) { .gc-mk-grafik { grid-template-columns: 1fr; } }
.gc-mk-grafik h4 { margin: 2px 0 6px; font-size: 12.5px; }
.gc-mk-liste { max-height: 44vh; overflow: auto; border: 1px solid var(--line); border-radius: 10px; }
.gc-mk-sat { display: grid; grid-template-columns: 82px 1fr 128px 96px 92px; gap: 8px;
  align-items: center; padding: 7px 10px; border-bottom: 1px solid var(--line); font-size: 12.5px; }
.gc-mk-sat:last-child { border-bottom: 0; }
.gc-mk-sat:hover { background: var(--bg); }
.gc-mk-sat .t { font-weight: 700; font-size: 12px; white-space: nowrap; }
.gc-mk-sat .prob { font-weight: 600; }
.gc-mk-sat .alt { font-size: 11px; color: var(--muted); }
.gc-mk-sat.gec .t, .gc-mk-sat .gec-t { color: #d64545; }
@media (max-width: 760px) { .gc-mk-sat { grid-template-columns: 74px 1fr 84px; }
  .gc-mk-sat .alt:nth-child(3) { display: none; } }

/* Toplantı modu: menü gizlenir, yazılar büyür — projeksiyonda okunaklı */
body.gc-tam .sidebar, body.gc-tam .mobile-top, body.gc-tam .side-collapse { display: none !important; }
body.gc-tam .content { max-width: none; padding: 18px 34px; }
.gc-toplanti .gc-sat { grid-template-columns: 86px 1fr 150px 110px 104px auto; padding: 11px 13px; }
.gc-toplanti .gc-sat .prob { font-size: 15.5px; white-space: normal; }
.gc-toplanti .gc-sat .alt { font-size: 12px; }
.gc-toplanti .gc-sat .mak { font-size: 13px; }
.gc-toplanti .gc-kpi .v { font-size: 26px; }

/* ---------- ❓ MODÜL YARDIMI (her ekranın sağ üstündeki düğme + kart) ---------- */
.content-bar { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; }
.content-bar #btn-back { margin-bottom: 0; }
.content-bar .btn-help { margin-left: auto; }
.btn-help { border-color: var(--navy); color: var(--navy); font-weight: 600; }
.btn-help:hover { background: var(--navy); color: #fff; }
html[data-theme="dark"] .btn-help { border-color: #4a7fb5; color: #cfe0f3; }
html[data-theme="dark"] .btn-help:hover { background: #24384f; color: #fff; }
.yrd-ozet { font-size: 14.5px; margin: 0 0 10px; }
.yrd-kim { background: var(--soft, #f2f6fa); border-left: 3px solid var(--navy); border-radius: 0 8px 8px 0;
  padding: 8px 12px; font-size: 13px; margin-bottom: 4px; }
html[data-theme="dark"] .yrd-kim { background: #1b2735; }
.yrd-h { margin: 16px 0 8px; font-size: 14px; color: var(--navy); }
html[data-theme="dark"] .yrd-h { color: #9dc2ea; }
.yrd-adim { margin: 0; padding-left: 20px; display: flex; flex-direction: column; gap: 9px; }
.yrd-adim li { font-size: 13.5px; }
.yrd-adim li b { display: block; margin-bottom: 2px; }
.yrd-adim li span { color: var(--muted); }
.yrd-liste { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.yrd-liste li { display: flex; gap: 8px; font-size: 13.5px; align-items: flex-start; }
.yrd-liste li span { flex: 0 0 18px; }
.yrd-dip { margin-top: 16px; padding-top: 10px; border-top: 1px solid var(--line); }
@media (max-width: 760px) { .content-bar .btn-help .b-tx { display: none; } }
@media print { .content-bar { display: none; } }

/* ---- Rapor grafik parçaları (CCAR bölüm karnesi) ---- */
.rpx-kutular { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 12px; margin-bottom: 16px; }
.rpx-kutu { background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 13px 15px; box-shadow: var(--shadow); }
.rpx-kutu .e { font-size: 10.5px; letter-spacing: .08em; color: var(--muted); font-weight: 800; }
.rpx-kutu .v { font-size: 25px; font-weight: 800; line-height: 1.15; margin-top: 2px; }
.rpx-kutu .a { font-size: 11.5px; color: var(--muted); margin-top: 1px; }
/* Yığılmış oran çubuğu (durum dağılımı) */
.rpx-yigin { display: flex; height: 13px; border-radius: 7px; overflow: hidden; background: var(--bg);
  border: 1px solid var(--line); }
.rpx-yigin i { display: block; height: 100%; }
/* İkili sütun grafiği (açılan / kapanan) */
.rpx-sutunlar { display: flex; align-items: flex-end; gap: 6px; height: 130px; padding-top: 6px; overflow-x: auto; }
.rpx-sut { display: flex; flex-direction: column; align-items: center; gap: 4px; min-width: 34px; flex: 1; height: 100%; }
.rpx-cift { display: flex; align-items: flex-end; gap: 2px; height: 100%; width: 100%; justify-content: center; }
.rpx-cift i { display: block; width: 11px; min-height: 2px; border-radius: 3px 3px 0 0; }
.rpx-sut span { font-size: 9.5px; color: var(--muted); white-space: nowrap; }
.rpx-legend { display: flex; gap: 12px; flex-wrap: wrap; font-size: 11px; color: var(--muted); margin-top: 6px; }
.rpx-legend i { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 4px; vertical-align: -1px; }
/* Pareto çubuğu */
.rpx-cubuk { display: flex; align-items: center; gap: 9px; margin: 4px 0; }
.rpx-cubuk .n { width: 200px; font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex: none; }
.rpx-cubuk .b { flex: 1; background: var(--bg); border-radius: 5px; height: 15px; overflow: hidden; }
.rpx-cubuk .b i { display: block; height: 100%; border-radius: 5px; }
.rpx-cubuk .s { width: 62px; text-align: right; font-size: 12px; font-weight: 700; flex: none; }
/* Karne harf notu */
.rpx-not { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px;
  border-radius: 8px; color: #fff; font-weight: 800; font-size: 14px; }
/* İki panelin yan yana durduğu satır */
.rp-ikili { display: grid; grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); gap: 14px; }
@media (max-width: 760px) {
  .rpx-cubuk .n { width: 120px; }
  .rp-ikili { grid-template-columns: 1fr; }
}

/* ---- CCAR: Excel tarzı süzgeç menüsü + sıralama (2026-09-02) ---- */
.gc-th.tik { cursor: pointer; }
.gc-th.tik:hover { text-decoration: underline; }
.gc-huni.sira { color: #ffd166; font-weight: 800; }
.gc-suz-cip.sira { border-color: #c9b26a; background: #fffbea; }
.gc-suz-menu { display: flex; flex-direction: column; gap: 8px; }
.gc-suz-sira { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.gc-suz-aralik { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.gc-suz-aralik input { width: 130px; }
.gc-suz-ara { width: 100%; box-sizing: border-box; }
.gc-suz-menu .gc-suz-sat { display: grid; grid-template-columns: 18px 1fr auto; gap: 8px; align-items: center;
  padding: 4px 7px; border-radius: 6px; font-size: 13px; font-weight: 500; cursor: pointer; }
.gc-suz-menu .gc-suz-sat input { width: auto; margin: 0; }
.gc-suz-menu .gc-suz-sat span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gc-suz-hepsi { border-bottom: 1px solid var(--line); border-radius: 0 !important; }
.gc-suz-menu .gc-suz-liste { max-height: 300px; }
html[data-theme="dark"] .gc-suz-cip.sira { background: #2b2a1c; border-color: #6b5f2e; }

.gc-durum-kutu { display: flex; flex-direction: column; gap: 3px; align-items: flex-start; }

/* ---- CCAR: Risk önceliği panosu P1/P2/P3 (2026-09-02) ---- */
.gc-rk-bas { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; }
.gc-rk-bas h2 { margin: 0; }
.gc-rk-cipler { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0; }
.gc-rk-cip { border: 1.5px solid var(--c, #3b5170); color: var(--c, #3b5170); background: transparent; border-radius: 999px;
  padding: 4px 11px; font-size: 12px; font-weight: 700; cursor: pointer; }
.gc-rk-cip b { font-size: 13px; }
.gc-rk-cip.on { background: var(--c, #3b5170); color: #fff; }
.gc-p { display: inline-block; font-size: 10.5px; font-weight: 900; padding: 1px 7px; border-radius: 6px; color: #fff; letter-spacing: .03em; }
.gc-p.P1 { background: #d64545; }
.gc-p.P2 { background: #e08a1e; }
.gc-p.P3 { background: #1f9d55; }
.gc-ovr { display: inline-flex; align-items: center; justify-content: center; width: 16px; height: 16px; border-radius: 50%;
  background: #7a1f1f; color: #fff; font-size: 10px; font-weight: 900; cursor: help; vertical-align: middle; }
.gc-ihlal { font-size: 10.5px; font-weight: 800; color: #7a1f1f; background: #fde8e8; padding: 1px 6px; border-radius: 6px; white-space: nowrap; }
.gc-rk-iki { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.gc-rk-iki h4 { margin: 2px 0 6px; font-size: 12.5px; }
.gc-aile { display: grid; grid-template-columns: 26px 1fr; gap: 8px; align-items: start; padding: 6px 6px; border-radius: 8px;
  border-bottom: 1px solid var(--line); }
.gc-aile:last-child { border-bottom: 0; }
.gc-aile .no { font-weight: 900; font-size: 15px; color: var(--muted); text-align: center; }
.gc-aile .bas { font-size: 12.5px; }
.gc-aile .alt { font-size: 11.5px; color: var(--muted); margin-top: 2px; display: flex; flex-wrap: wrap; gap: 4px 6px; align-items: center; }
.gc-aile.gc-tikla:hover { background: var(--bg); }
.gc-rk-tablo td.gc-sag { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.gc-rk-tablo td.gc-puan { font-size: 10.5px; color: var(--muted); white-space: nowrap; letter-spacing: .02em; }
.gc-rk-tablo tbody tr.gc-tikla { cursor: pointer; }
.gc-rk-nasil { margin-top: 10px; font-size: 12px; }
.gc-rk-nasil summary { cursor: pointer; font-weight: 700; color: var(--muted); }
.gc-rk-nasil p { margin: 6px 0; }
.gc-aile-roz { background: #fff8ec; border: 1px solid #f0d9a8; border-radius: 10px; padding: 8px 12px; font-size: 12.5px; margin-bottom: 10px; }
@media (max-width: 860px) {
  .gc-rk-iki { grid-template-columns: 1fr; }
}
html[data-theme="dark"] .gc-aile-roz { background: #2b2416; border-color: #5c4a22; }
html[data-theme="dark"] .gc-ihlal { background: #3a1c1c; color: #f0a3a3; }

/* ==========================================================================
   AkaQMS MARKA BİLEŞENLERİ: logo, lisans, organizasyon kişi kartı, kalibrasyon
   ========================================================================== */
.logo-img.logo-mark { border-radius: 10px; object-fit: contain; display: block; }
.logo-img.logo-yatay { max-height: 44px; width: auto; }
.boot-logo { background: none; width: auto; height: auto; border-radius: 0; }
.boot-logo img { width: 76px; height: 76px; border-radius: 18px; box-shadow: 0 10px 30px rgba(43, 47, 54, .18); }
.side-title, .lv-brand b, .mt-title, .op-brand span {
  font-family: 'Archivo', "Segoe UI", system-ui, -apple-system, Roboto, Arial, sans-serif; letter-spacing: .01em; }
.side-brand .logo-mark { border-radius: 9px; box-shadow: 0 2px 8px rgba(0, 0, 0, .25); }
.marka-onizleme { display: flex; gap: 14px; align-items: center; flex-wrap: wrap; padding: 14px;
  background: var(--panel-2); border: 1px solid var(--line); border-radius: 10px; }
.marka-onizleme img { border: 0; padding: 0; background: transparent; }

/* --- Lisans --- */
.lisans-cip { display: block; margin: 2px 10px 6px; padding: 7px 10px; border-radius: 9px; font-size: 12px;
  font-weight: 700; text-align: center; line-height: 1.3; }
.lisans-cip.lisans-yok { background: rgba(214, 69, 69, .2); color: #ffd3d3; border: 1px solid rgba(214, 69, 69, .5); }
.lisans-cip.lisans-yakin { background: rgba(200, 81, 31, .2); color: #ffd7c4; border: 1px solid rgba(200, 81, 31, .55); }
.lisans-cip:hover { text-decoration: none; filter: brightness(1.12); }
.sidebar.collapsed .lisans-cip { display: none; }
.lisans-engel { max-width: 580px; margin: 8vh auto; text-align: center; background: var(--panel);
  border: 1px solid var(--line); border-radius: 16px; padding: 36px 32px; box-shadow: var(--shadow); }
.lisans-engel-ikon { font-size: 46px; margin-bottom: 8px; line-height: 1; }
.lisans-engel h1 { font-size: 21px; margin: 0 0 10px; }
.lisans-engel p { color: var(--muted); margin: 6px 0; }
.lisans-engel .btn { margin-top: 12px; }
.lisans-durum { display: flex; gap: 14px; align-items: flex-start; border: 1px solid var(--line);
  border-left: 5px solid var(--green); border-radius: 12px; padding: 14px 16px; background: var(--panel-2); margin-bottom: 4px; }
.lisans-durum.yok { border-left-color: var(--red); }
.lisans-durum .ld-ikon { font-size: 30px; line-height: 1; }
.lisans-modul-liste { display: flex; flex-wrap: wrap; gap: 6px; }
.lisans-modul-liste .badge { font-size: 12px; padding: 4px 9px; }
.makine-kimlik { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin: 8px 0 4px; }
.makine-kimlik code { font-size: 19px; font-weight: 800; letter-spacing: .1em; color: var(--navy);
  background: var(--panel-2); border: 1px dashed var(--line); border-radius: 10px; padding: 9px 14px;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; user-select: all; }
#lk-key { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 12px; word-break: break-all; }

/* --- Organizasyon: kişi kartı --- */
.org-kart { display: flex; gap: 18px; align-items: flex-start; }
.org-kart .on-photo-xl { width: 112px; height: 112px; line-height: 108px; font-size: 34px; margin: 0; flex: none;
  border-radius: 18px; }
.org-kart-tx { min-width: 0; flex: 1; }
.org-kart-tx h3 { margin: 2px 0 2px; font-size: 18px; }
.org-kart-unvan { color: var(--accent-2); font-weight: 700; font-size: 13.5px; margin-bottom: 8px; }
@media (max-width: 560px) { .org-kart { flex-direction: column; align-items: center; text-align: center; } }

/* --- Kalibrasyon & Doğrulama --- */
.kl-kunye { display: grid; gap: 2px; }
.kl-kunye-satir { display: grid; grid-template-columns: 150px 1fr; gap: 10px; padding: 6px 0;
  border-bottom: 1px dashed var(--line); font-size: 13px; }
.kl-kunye-satir:last-child { border-bottom: 0; }
.kl-kunye-satir .e { color: var(--muted); font-weight: 600; font-size: 12px; }
.kl-kunye-satir .v { min-width: 0; overflow-wrap: anywhere; }
.kl-plan th.kl-ay, .kl-plan td.kl-ay { text-align: center; min-width: 44px; white-space: nowrap; }
.kl-plan .bu-ay { background: rgba(200, 81, 31, .07); }
.kl-isaret { display: inline-flex; align-items: center; justify-content: center; width: 21px; height: 21px;
  border-radius: 6px; font-size: 10.5px; font-weight: 800; margin: 1px; cursor: pointer; font-style: normal; }
.kl-isaret.plan { background: var(--blue-bg); color: var(--info); }
.kl-isaret.ok { background: var(--green-bg); color: var(--green); }
.kl-isaret.gec { background: var(--red-bg); color: var(--red); }
.kl-isaret.red { background: var(--red); color: #fff; }
.kl-leg i.kl-isaret { width: 19px; height: 19px; margin-right: 5px; cursor: default; }
.form-col label.kl-onay-satir { flex-direction: row; align-items: center; gap: 9px; font-weight: 500; }
.form-col label.kl-onay-satir input { width: auto; flex: 0 0 auto; margin: 0; }
tr.row-inactive td { opacity: .55; }
@media (max-width: 560px) { .kl-kunye-satir { grid-template-columns: 1fr; gap: 2px; } }

/* ==========================================================================
   ORTAK GÖRSEL BİLEŞENLER (public/js/gorsel.js)
   Buradaki hiçbir kural modül adı BİLMEZ; hepsi --mod / --mod-wash /
   --mod-canli okur. Ekran gövdesine .mod-msa · .mod-spc konunca aynı
   bileşen o modülün tonunu alır (tanımlar :root yanında).
   ========================================================================== */

/* ---- Zengin sayfa başlığı ---- */
.gr-hero { display: flex; align-items: flex-start; gap: 14px; margin: 2px 0 0; flex-wrap: wrap; }
.gr-hero-ikon {
  width: 48px; height: 48px; border-radius: 14px; flex: none;
  display: flex; align-items: center; justify-content: center; font-size: 25px; line-height: 1;
  background: var(--mod-wash); color: var(--mod);
  box-shadow: inset 0 0 0 1px rgba(var(--mod-rgb) / .22);
}
.gr-hero-tx { min-width: 220px; flex: 1; }
.gr-hero-tx h1 { font-size: 22px; margin: 0 0 3px; font-weight: 700; color: var(--navy); letter-spacing: -.01em; }
.gr-hero-tx p { margin: 0; color: var(--muted); font-size: 13px; max-width: 78ch; }
.gr-hero-sag { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin-left: auto; }
.gr-hero-rozet {
  display: inline-block; vertical-align: 3px; font-size: 10.5px; font-weight: 800; letter-spacing: .06em;
  text-transform: uppercase; padding: 2px 9px; border-radius: 999px;
  background: var(--mod-wash); color: var(--mod-2); box-shadow: inset 0 0 0 1px rgba(var(--mod-rgb) / .25);
}
/* Modülün rengini taşıyan ince şerit: kullanıcı hangi ekranda olduğunu
   başlığı okumadan anlar. Soldan sağa söner — "çizgi" değil "ışık" olsun. */
.gr-serit {
  height: 3px; border-radius: 3px; margin: 13px 0 16px;
  background: linear-gradient(90deg, var(--mod) 0%, var(--mod-canli) 20%,
    rgba(var(--mod-rgb) / .22) 58%, rgba(var(--mod-rgb) / 0) 100%);
}

/* ---- Sayı kartları ---- */
.gr-kartlar { display: grid; grid-template-columns: repeat(auto-fit, minmax(152px, 1fr)); gap: 10px; margin: 0 0 15px; }
.gr-kart {
  --t: var(--muted); --tw: var(--panel-2);
  position: relative; overflow: hidden; display: flex; flex-direction: column; gap: 2px;
  align-items: flex-start; text-align: left; background: var(--panel);
  border: 1px solid var(--line); border-radius: 13px; padding: 12px 14px 11px 16px;
  cursor: pointer; font: inherit; color: inherit;
  transition: transform .16s var(--ease, ease), box-shadow .16s var(--ease, ease), border-color .16s;
}
.gr-kart::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--t); }
.gr-kart.t-mod { --t: var(--mod); --tw: var(--mod-wash); }
.gr-kart.t-iyi { --t: var(--green); --tw: var(--green-bg); }
.gr-kart.t-uyari { --t: var(--orange); --tw: var(--orange-bg); }
.gr-kart.t-kotu { --t: var(--red); --tw: var(--red-bg); }
.gr-kart.t-notr { --t: var(--muted); --tw: var(--panel-2); }
.gr-kart-ust { display: flex; align-items: center; gap: 9px; }
.gr-kart-ikon {
  width: 26px; height: 26px; border-radius: 8px; flex: none; font-size: 14px; line-height: 1;
  display: flex; align-items: center; justify-content: center; background: var(--tw); color: var(--t);
}
.gr-kart-sayi { font-size: 27px; font-weight: 750; line-height: 1; font-variant-numeric: tabular-nums; color: var(--t); }
.gr-kart-ad { font-weight: 650; font-size: 12.5px; margin-top: 4px; }
.gr-kart-alt { font-size: 10.5px; color: var(--muted); }
.gr-kart:hover { transform: translateY(-2px); box-shadow: 0 8px 18px rgba(12, 40, 50, .11); border-color: var(--line-2); }
.gr-kart.secili { background: var(--tw); border-color: var(--t); box-shadow: inset 0 0 0 1px var(--t); }

/* ---- Pano: geniş görsel + dar görsel yan yana ---- */
.gr-pano { display: grid; grid-template-columns: 1.55fr 1fr; gap: 13px; margin: 0 0 15px; align-items: stretch; }
.gr-pano > * { min-width: 0; margin-bottom: 0; }
@media (max-width: 980px) { .gr-pano { grid-template-columns: 1fr; } }

/* ---- Panel başlığı (küçük, büyük harf, sağda not) ---- */
.gr-panel-bas { display: flex; align-items: baseline; gap: 10px; margin: 0 0 12px; }
.gr-panel-bas h2 { margin: 0; font-size: 11.5px; font-weight: 800; letter-spacing: .07em;
  text-transform: uppercase; color: var(--muted); }
.gr-panel-bas > span { margin-left: auto; font-size: 11.5px; color: var(--muted); }

/* ---- Halka (donut) + lejant ---- */
.gr-halka-sar { position: relative; display: flex; align-items: center; justify-content: center; }
.gr-halka { display: block; }
.gr-halka-orta { position: absolute; inset: 0; display: flex; flex-direction: column;
  align-items: center; justify-content: center; pointer-events: none; }
.gr-halka-orta b { font-size: 26px; font-weight: 750; line-height: 1; color: var(--navy); font-variant-numeric: tabular-nums; }
.gr-halka-orta span { font-size: 9.5px; color: var(--muted); margin-top: 3px; text-transform: uppercase; letter-spacing: .07em; }
.gr-lejant { list-style: none; margin: 13px 0 0; padding: 0; display: flex; flex-direction: column; gap: 7px; }
.gr-lejant li { display: flex; align-items: center; gap: 9px; font-size: 12.5px; }
.gr-lejant i { width: 10px; height: 10px; border-radius: 3px; flex: none; }
.gr-lejant-ad { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gr-lejant b { font-variant-numeric: tabular-nums; }
.gr-lejant-yuzde { color: var(--muted); font-size: 11px; min-width: 36px; text-align: right; font-variant-numeric: tabular-nums; }

/* ---- Yıl şeridi: 12 ay, sütun yüksekliği iş sayısı, renk EN KÖTÜ durum ---- */
.gr-yil { display: grid; grid-template-columns: repeat(12, 1fr); gap: 5px; }
.gr-yil-ay { height: 116px; display: flex; flex-direction: column; align-items: center;
  justify-content: flex-end; gap: 3px; padding: 4px 2px 3px; border-radius: 9px; }
.gr-yil-ay.bu { background: var(--mod-wash); box-shadow: inset 0 0 0 1px rgba(var(--mod-rgb) / .25); }
.gr-yil-cubuk { display: block; width: 100%; max-width: 24px; border-radius: 4px 4px 2px 2px; background: var(--line); }
.gr-yil-cubuk.t { background: var(--green); }
.gr-yil-cubuk.a { background: var(--mod); }
.gr-yil-cubuk.g { background: var(--red); }
.gr-yil-n { font-size: 10.5px; font-weight: 700; min-height: 13px; font-variant-numeric: tabular-nums; }
.gr-yil-ad { font-size: 10px; color: var(--muted); }

/* ---- Satır içi ölçek çubuğu ---- */
.gr-olcek { display: inline-flex; align-items: center; gap: 7px; white-space: nowrap; }
.gr-olcek-ray { width: 54px; height: 6px; border-radius: 99px; background: var(--line); overflow: hidden; flex: none; }
.gr-olcek-ray i { display: block; height: 100%; border-radius: 99px; }
.gr-olcek b { font-variant-numeric: tabular-nums; font-size: 12.5px; }
.gr-olcek-max { color: var(--muted); font-size: 11px; }

/* ---- Boş durum ---- */
.gr-bos { text-align: center; padding: 42px 24px; background: var(--panel);
  border: 1px dashed var(--line-2); border-radius: 14px; }
.gr-bos-ikon { width: 64px; height: 64px; border-radius: 20px; margin: 0 auto 15px;
  display: flex; align-items: center; justify-content: center; font-size: 30px;
  background: var(--mod-wash); color: var(--mod); box-shadow: inset 0 0 0 1px rgba(var(--mod-rgb) / .2); }
.gr-bos h3 { margin: 0 0 7px; font-size: 16px; color: var(--navy); }
.gr-bos p { margin: 0 auto; max-width: 54ch; color: var(--muted); font-size: 13px; }
.gr-bos-eylem { margin-top: 17px; display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; }

/* Modül tonuyla boyanan birincil düğme (hero ve boş durumdaki ana eylem) */
.btn.btn-mod { background: var(--mod); border-color: var(--mod); color: #fff; }
.btn.btn-mod:hover { background: var(--mod-2); border-color: var(--mod-2); }

@media (max-width: 720px) {
  .gr-yil-ad { font-size: 9px; }
  .gr-hero-ikon { width: 42px; height: 42px; font-size: 22px; border-radius: 12px; }
  .gr-hero-tx h1 { font-size: 19px; }
}
/* Yazdırmada dekoratif şerit ve hover gölgeleri gereksiz */
@media print { .gr-serit { background: var(--mod); } .gr-kart { box-shadow: none; } }

html[data-theme="dark"] .gr-kart { border-color: rgba(255, 255, 255, .11); }
html[data-theme="dark"] .gr-kart:hover { box-shadow: 0 8px 18px rgba(0, 0, 0, .35); }
html[data-theme="dark"] .gr-bos { border-color: rgba(255, 255, 255, .16); }

/* ==========================================================================
   MSA / SPC PLANLARI (views-olcumplan.js)
   İki modül AYNI ekrandan çizilir, stiller de ortaktır: sonuç/karar
   rozetleri, dosya bırakma alanı, onaycı rozetleri, plan formu ızgaraları.
   ========================================================================== */
/* Kabul kararı — sayıya bakmadan renkten okunur */
.olc-karar { display: inline-block; font-size: 10.5px; font-weight: 800; letter-spacing: .2px;
  padding: 2px 8px; border-radius: 999px; border: 1px solid transparent; white-space: nowrap; }
.olc-karar.k-iyi { background: var(--green-bg); color: var(--green); border-color: var(--green-line); }
.olc-karar.k-sart { background: var(--orange-bg); color: var(--orange); border-color: var(--orange-line); }
.olc-karar.k-kotu { background: var(--red-bg); color: var(--red); border-color: var(--red-line); }
.olc-karar.k-yok { background: var(--panel-2); color: var(--muted); border-color: var(--line); }
.olc-deger { font-size: 11.5px; color: var(--muted); margin-right: 7px; white-space: nowrap; }
.olc-deger b { color: var(--text); font-variant-numeric: tabular-nums; }
.olc-karar-kutu { margin-top: 11px; padding: 9px 12px; border-radius: 9px; border: 1px solid var(--line);
  border-left-width: 4px; font-size: 13px; }
.olc-karar-kutu.k-iyi { background: var(--green-bg); border-color: var(--green-line); border-left-color: var(--green); }
.olc-karar-kutu.k-sart { background: var(--orange-bg); border-color: var(--orange-line); border-left-color: var(--orange); }
.olc-karar-kutu.k-kotu { background: var(--red-bg); border-color: var(--red-line); border-left-color: var(--red); }
.olc-karar-kutu.k-yok { background: var(--panel-2); border-left-color: var(--line-2); }
.olc-ikili { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; align-items: start; }
.olc-ikili > * { min-width: 0; }
.olc-birak { border: 2px dashed var(--line-2); border-radius: 11px; padding: 17px; text-align: center;
  background: var(--panel-2); }
.olc-birak.uzerinde { border-color: var(--mod); background: var(--mod-wash); }
.olc-ek { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 6px 0;
  border-bottom: 1px solid var(--line); font-size: 12.5px; }
.olc-ek:last-child { border-bottom: 0; }
.olc-ek-ad { font-weight: 600; flex: 1; min-width: 150px; }
.olc-onaycilar { display: flex; gap: 7px; flex-wrap: wrap; }
.olc-onayci { font-size: 11.5px; padding: 4px 10px; border-radius: 999px; border: 1px solid var(--line);
  background: var(--panel); }
.olc-onayci.ok { background: var(--green-bg); color: var(--green); border-color: var(--green-line); font-weight: 650; }
.olc-onayci.red { background: var(--red-bg); color: var(--red); border-color: var(--red-line); font-weight: 650; }
.olc-onayci.bek { background: var(--orange-bg); color: var(--orange); border-color: var(--orange-line); }
.olc-gecmis { padding: 5px 0; border-bottom: 1px solid var(--line); font-size: 12.5px; }
.olc-gecmis:last-child { border-bottom: 0; }
.olc-y { color: var(--green); font-weight: 650; } .olc-k { color: var(--red); font-weight: 650; }
/* ".form-col label" etiketleri DİKEY dizer; onay kutusu yatay kalsın */
.form-col label.olc-onay, .olc-onay { display: flex; flex-direction: row; align-items: center;
  gap: 6px; flex: none; font-size: 12.5px; font-weight: 500; cursor: pointer; }
.olc-onay input, .filter-bar .olc-onay input { width: auto; min-width: 0; flex: 0 0 auto; margin: 0; }
/* Başlık, form ızgaraları, eylem satırı */
.olc-h { margin: 14px 0 6px; font-size: 14px; color: var(--navy); }
.olc-ipucu { font-weight: 400; }
.panel > .olc-h:first-child { margin-top: 0; }
.olc-iki { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.olc-uc { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px; }
.olc-satir { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.olc-dugmeler { display: flex; gap: 8px; align-self: flex-start; }
.olc-gec td { background: #FDF3F2; }
.olc-duzenlenen td { background: var(--mod-wash); }
/* Sıradaki işler (yıl şeridinin altındaki kısa liste) */
.olc-sirada { margin-top: 14px; border-top: 1px solid var(--line); padding-top: 11px; }
.olc-sirada h3 { font-size: 11.5px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase;
  color: var(--muted); margin: 0 0 7px; }
.olc-sirada-s { display: flex; align-items: center; gap: 10px; width: 100%; text-align: left;
  background: none; border: 0; border-radius: 8px; padding: 6px 8px; cursor: pointer; font: inherit; color: inherit; }
.olc-sirada-s:hover { background: var(--mod-wash); }
.olc-sirada-no { font-size: 11.5px; font-weight: 700; color: var(--mod-2); min-width: 78px; font-variant-numeric: tabular-nums; }
.olc-sirada-ad { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12.5px; }
.olc-sirada-t { font-size: 11.5px; color: var(--muted); white-space: nowrap; }
.olc-sirada-t.gec { color: var(--red); font-weight: 700; }
@media (max-width: 1100px) { .olc-ikili { grid-template-columns: 1fr; } }
@media (max-width: 800px) { .olc-uc { grid-template-columns: 1fr; } }
@media (max-width: 700px) { .olc-iki { grid-template-columns: 1fr; } }
html[data-theme="dark"] .olc-gec td { background: rgba(214, 69, 69, .12); }
html[data-theme="dark"] .olc-onayci { border-color: rgba(255, 255, 255, .12); }

/* =========================================================================
   FMEA & KONTROL PLANI (views-fmea.js) — SADE görsel dil: beyaz panel, ince
   çizgi, tek vurgu (marka turuncusu); renkli rozet yalnız durum bildirir.
   ========================================================================= */
.fm-tablo td { line-height: 1.4; }
.fm-tablo td.n, .fm-tablo th.n { text-align: center; font-variant-numeric: tabular-nums; width: 34px; }
.fm-kp-b { color: #35506b; }
.fm-bosluk { display: inline-block; min-width: 46px; padding: 0 6px; border: 1.5px dashed #C9C5BE; border-radius: 5px;
  color: var(--muted); font-size: 11.5px; line-height: 18px; text-align: center; background: var(--panel-2); }
.fm-dolu { background: #FFF1CC; border-radius: 4px; padding: 0 4px; font-weight: 600; }
.fm-kay { display: inline-flex; align-items: center; justify-content: center; width: 20px; height: 20px; border-radius: 5px;
  font-size: 10.5px; font-weight: 800; color: var(--muted); box-shadow: inset 0 0 0 1px var(--line-2); background: var(--panel); }
.fm-kay.p { color: var(--accent); box-shadow: inset 0 0 0 1.5px var(--accent); }
.fm-rpn { display: inline-block; min-width: 32px; text-align: center; font-weight: 700; border-radius: 5px; padding: 1px 4px;
  font-variant-numeric: tabular-nums; }
.fm-rpn.yuk { background: var(--red-bg); color: var(--red); }
.fm-ap { font-size: 10px; font-weight: 700; color: var(--muted); margin-top: 2px; white-space: nowrap; }
.fm-ap.ap-Y { color: var(--red); } .fm-ap.ap-O { color: var(--orange); }
.fm-ozel { display: inline-block; font-size: 10px; font-weight: 800; color: var(--red); border: 1px solid var(--red-line);
  border-radius: 4px; padding: 0 4px; margin-left: 2px; vertical-align: 1px; }
.fm-yerel { font-size: 10.5px; color: var(--accent); font-weight: 700; margin-top: 2px; }
.fm-yerel.gri { color: var(--muted); font-weight: 600; }
.fm-dok { color: var(--accent-2); white-space: nowrap; font-size: 12px; }
.fm-dok.yok { color: var(--red); }
button.fm-dok.bos { font: inherit; font-size: 12px; color: var(--muted); border: 1.5px dashed var(--accent); border-radius: 6px;
  padding: 1px 8px; background: var(--mod-wash); cursor: pointer; }
.fm-aks-var { font-size: 10.5px; color: var(--red); white-space: nowrap; margin-top: 2px; }
.fm-op-sat td { background: var(--panel-2); font-size: 12px; color: var(--muted); padding-top: 5px !important; padding-bottom: 5px !important; }
.fm-op-sat td b { color: var(--text); }
.fm-dosya-tablo tr.fm-degisti td:first-child { box-shadow: inset 3px 0 0 var(--orange); }
.fm-dosya-tablo tr.fm-yeni td:first-child { box-shadow: inset 3px 0 0 var(--green); }
.fm-dosya-tablo tr.fm-haric td { opacity: .5; }
.fm-rozet { display: inline-block; font-size: 11px; padding: 2px 8px; border-radius: 999px; background: var(--panel-2);
  box-shadow: inset 0 0 0 1px var(--line); white-space: nowrap; }
.fm-rozet.v { background: var(--mod-wash); color: var(--accent-2); box-shadow: none; font-weight: 700; }
.fm-rozet.u { background: var(--orange-bg); color: var(--orange); box-shadow: none; font-weight: 700; }
.fm-rozet.y { background: var(--green-bg); color: var(--green); box-shadow: none; font-weight: 700; }
.fm-rev { font-weight: 700; white-space: nowrap; }
.fm-bekci-say { display: inline-flex; min-width: 22px; height: 22px; align-items: center; justify-content: center; border-radius: 999px;
  background: var(--red-bg); color: var(--red); font-weight: 800; font-size: 12px; cursor: help; }
.fm-lejant { display: flex; gap: 14px; flex-wrap: wrap; align-items: center; font-size: 12px; color: var(--muted); margin-top: 10px; }
.fm-lejant.ic { margin: 0 0 0 auto; padding: 0 4px 6px; }
.fm-lejant .sag { margin-left: auto; }
.fm-alt { display: flex; gap: 14px; align-items: center; flex-wrap: wrap; padding: 10px 4px 4px; }

/* Revizyon şeridi */
.fm-rev-serit { display: flex; align-items: center; gap: 12px; padding: 10px 14px; border-radius: var(--radius); background: var(--panel);
  box-shadow: 0 0 0 1px var(--line); margin-bottom: 12px; font-size: 13px; flex-wrap: wrap; }
.fm-rev-b { font-size: 15px; }
.fm-ayrac { width: 1px; height: 22px; background: var(--line); }
.fm-serit-sag { margin-left: auto; display: flex; gap: 8px; flex-wrap: wrap; }
.fm-bekci-kutu { border-radius: var(--radius); background: var(--mod-wash); box-shadow: inset 0 0 0 1px rgba(var(--accent-rgb) / .25);
  padding: 10px 14px; margin-bottom: 12px; font-size: 13px; }
.fm-bekci-s { display: flex; gap: 10px; align-items: center; padding: 5px 0; border-top: 1px solid rgba(var(--accent-rgb) / .15); }
.fm-bekci-s:first-of-type { margin-top: 6px; }
.fm-bekci-s > span:nth-child(2) { flex: 1; min-width: 0; }

/* Ana ekran: bekçi + kurallar */
.fm-bekci-grid { display: grid; grid-template-columns: 1fr 330px; gap: 14px; align-items: start; }
.fm-bekci-ik { width: 26px; font-size: 15px; text-align: center; }
.fm-kural-ozet > div { display: flex; justify-content: space-between; gap: 10px; padding: 6px 0; border-top: 1px solid var(--line); font-size: 13px; }
.fm-kural-ozet > div:first-child { border-top: 0; }
.fm-ornek { margin-top: 12px; border-radius: 9px; background: var(--panel-2); box-shadow: inset 0 0 0 1px var(--line);
  padding: 10px 12px; font-size: 12px; line-height: 1.8; }
.fm-kr { display: grid; grid-template-columns: 1fr auto; gap: 10px; align-items: center; padding: 9px 0; border-top: 1px solid var(--line); }
.fm-kr:first-child { border-top: 0; padding-top: 0; }
.fm-kr b { font-size: 13px; display: block; }
.fm-kr small { font-size: 11.5px; color: var(--muted); display: block; margin-top: 2px; }
.fm-kr-d { display: flex; align-items: center; gap: 6px; }
.fm-kr-d input[type=number] { width: 80px; text-align: center; font-weight: 700; }
.fm-kr-d em { font-style: normal; font-size: 12px; color: var(--muted); }

/* Kütüphane / aileler iki sütun */
.fm-kutuphane { display: grid; grid-template-columns: 250px 1fr; gap: 14px; align-items: start; }
.fm-kutuphane > *, .fm-bekci-grid > *, .fm-sih-grid > * { min-width: 0; }
.fm-op-liste { padding: 10px; }
.fm-liste-bas { display: flex; justify-content: space-between; align-items: center; padding: 2px 6px 8px; }
.fm-op { display: flex; justify-content: space-between; align-items: center; width: 100%; text-align: left; background: none; border: 0;
  border-radius: 8px; padding: 8px 10px; font: inherit; font-size: 13px; cursor: pointer; color: inherit; }
.fm-op:hover { background: var(--panel-2); }
.fm-op.sec { background: var(--mod-wash); color: var(--accent-2); font-weight: 700; }
.fm-op.pasif { opacity: .5; }
.fm-op small { font-size: 11px; color: var(--muted); font-weight: 400; white-space: nowrap; }
.fm-op-bas { display: flex; gap: 10px; align-items: center; margin: 0 0 12px; flex-wrap: wrap; font-size: 12.5px; }
.fm-op-ad { font-size: 16px; }
.fm-op-sag { margin-left: auto; display: flex; gap: 6px; align-items: center; }
.fm-akis { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; font-size: 12.5px; }
.fm-akis span { padding: 5px 10px; border-radius: 8px; background: var(--panel-2); box-shadow: inset 0 0 0 1px var(--line); }
.fm-akis em { color: var(--muted); font-style: normal; }
.fm-akis-duz { display: flex; flex-direction: column; gap: 6px; margin-bottom: 10px; }
.fm-akis-sat { display: flex; gap: 6px; align-items: center; }
.fm-akis-sat select { flex: 1; }
.fm-cips { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 6px; }
.fm-cips > span, .fm-cips > a { font-size: 11.5px; padding: 2px 8px; border-radius: 6px; background: var(--panel-2);
  box-shadow: inset 0 0 0 1px var(--line); color: inherit; text-decoration: none; }
.fm-cips > span.yr { color: var(--accent-2); box-shadow: inset 0 0 0 1.5px var(--accent); background: var(--mod-wash); font-weight: 700; }

/* Satır formu */
.fm-form { display: grid; grid-template-columns: 1.15fr 1fr; gap: 20px; }
.fm-form-bas { font-size: 11px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; color: var(--muted); margin: 0 0 2px; }
.fm-form-iki { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.fm-form-uc { display: grid; grid-template-columns: 1fr 1fr 70px; gap: 10px; }
.fm-form label, .fm-form-iki label, .fm-form-uc label { display: flex; flex-direction: column; gap: 4px; font-weight: 600; color: var(--navy); font-size: 12.5px; }
.fm-puan input { text-align: center; font-weight: 700; }
.fm-rpn-canli { text-align: right; }
.fm-dok-sec { display: flex; gap: 8px; align-items: center; justify-content: space-between; border: 1px solid var(--line);
  border-radius: 8px; padding: 6px 8px; font-weight: 400; }
.fm-satir-bilgi { margin-top: 10px; }
.fm-dok-liste { display: flex; flex-direction: column; gap: 2px; margin: 10px 0; max-height: 300px; overflow-y: auto; }
.fm-dok-s { display: grid; grid-template-columns: 92px 1fr auto; gap: 8px; align-items: center; text-align: left; background: none;
  border: 0; border-radius: 8px; padding: 7px 8px; font: inherit; font-size: 12.5px; cursor: pointer; color: inherit; }
.fm-dok-s:hover { background: var(--panel-2); }
.fm-dok-s.sec { background: var(--mod-wash); }
.fm-dok-mod { border-top: 1px solid var(--line); padding-top: 10px; display: flex; flex-direction: column; gap: 6px; font-size: 12.5px; }
.fm-dok-mod .check-line { align-items: flex-start; }
.fm-dok-mod input { margin-top: 3px; }

/* Etki penceresi */
.fm-etki-not { border-radius: 9px; background: #FFF4D6; padding: 9px 12px; font-size: 12.5px; font-weight: 600; margin-bottom: 12px; }
.fm-sayac { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-bottom: 12px; }
.fm-sayac div { border-radius: 9px; background: var(--panel-2); box-shadow: inset 0 0 0 1px var(--line); padding: 8px 10px; }
.fm-sayac b { display: block; font-size: 20px; font-variant-numeric: tabular-nums; }
.fm-sayac small { font-size: 11.5px; color: var(--muted); }
.fm-etki-aile { border-top: 1px solid var(--line); padding: 8px 0; font-size: 13px; }
.fm-uyari { border-radius: 10px; background: var(--mod-wash); box-shadow: inset 0 0 0 1.5px var(--accent); padding: 10px 12px; font-size: 12.5px; margin-top: 8px; }
.fm-uyari > b { display: block; color: var(--accent-2); margin-bottom: 6px; }
.fm-uyari-sec { display: flex; gap: 16px; margin-top: 8px; flex-wrap: wrap; }
.fm-uyari-sec input[type=radio], .fm-dok-mod input[type=radio] { width: auto; flex: 0 0 auto; margin: 3px 0 0; }
.fm-uyari-sec label, .fm-dok-mod label { flex: 0 1 auto; }
.form-col label .muted.small { font-weight: 400; }
.fm-iki-kolon { grid-column: span 2; display: flex; flex-direction: column; }
.fm-etki-ne { margin-top: 12px; font-size: 12.5px; }
.fm-etki-ne ol { margin: 6px 0 0; padding-left: 20px; line-height: 1.6; }
.fm-fark { margin: 0; padding-left: 18px; font-size: 13px; line-height: 1.7; }

/* Sihirbaz */
.fm-adimlar { display: flex; margin: 0 0 14px; background: var(--panel); border-radius: var(--radius); box-shadow: 0 0 0 1px var(--line); overflow: hidden; }
.fm-adimlar div { flex: 1; padding: 11px 16px; font-size: 13px; color: var(--muted); display: flex; align-items: center; gap: 9px; border-right: 1px solid var(--line); }
.fm-adimlar div:last-child { border-right: 0; }
.fm-adimlar b { width: 24px; height: 24px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: 12px;
  background: var(--panel-2); box-shadow: inset 0 0 0 1px var(--line-2); }
.fm-adimlar .ok b { background: var(--green); color: #fff; box-shadow: none; }
.fm-adimlar .su { color: var(--text); font-weight: 700; background: var(--mod-wash); }
.fm-adimlar .su b { background: var(--accent); color: #fff; box-shadow: none; }
.fm-parca-l { display: flex; flex-direction: column; gap: 2px; margin-top: 4px; }
.fm-parca-l button { text-align: left; background: var(--panel-2); border: 1px solid var(--line); border-radius: 7px; padding: 6px 10px;
  font: inherit; font-size: 12.5px; cursor: pointer; font-weight: 400; color: inherit; }
.fm-parca-l button:disabled { opacity: .55; cursor: not-allowed; }
.fm-parca-l button em { color: var(--muted); font-size: 11.5px; }
.fm-sih-grid { display: grid; grid-template-columns: 1fr 330px; gap: 14px; align-items: start; }
.fm-sih-op { padding: 12px 0; border-bottom: 1px solid var(--line); }
.fm-sih-op:last-of-type { border-bottom: 0; }
.fm-sih-op h3 { font-size: 13.5px; margin: 0 0 10px; display: flex; gap: 8px; align-items: center; }
.fm-sih-op h3 select { width: auto; }
.fm-no { font-size: 11px; font-weight: 800; color: var(--muted); background: var(--panel-2); border-radius: 5px; padding: 1px 6px; box-shadow: inset 0 0 0 1px var(--line); }
.fm-sih-alanlar { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.fm-sih-alanlar label { display: flex; flex-direction: column; gap: 4px; font-size: 12px; color: var(--muted); }
.fm-sih-alanlar label span { font-weight: 600; color: var(--text); }
.fm-sih-alanlar input.bos { box-shadow: inset 0 0 0 1.5px var(--accent); background: var(--mod-wash); border-color: transparent; }
.fm-ozet { list-style: none; margin: 8px 0; padding: 0; font-size: 13px; display: flex; flex-direction: column; gap: 8px; }
.fm-ozet li { display: flex; justify-content: space-between; }
.fm-cubuk { height: 8px; border-radius: 99px; background: var(--panel-2); box-shadow: inset 0 0 0 1px var(--line); overflow: hidden; margin: 6px 0 4px; }
.fm-cubuk i { display: block; height: 100%; background: var(--accent); }
.fm-sih-dug { display: flex; gap: 8px; justify-content: flex-end; }
@media (max-width: 1100px) { .fm-bekci-grid, .fm-sih-grid, .fm-kutuphane, .fm-form { grid-template-columns: 1fr; } .fm-sih-alanlar { grid-template-columns: 1fr 1fr; } }

html[data-theme="dark"] .fm-dolu { background: rgba(255, 196, 64, .2); }
html[data-theme="dark"] .fm-etki-not { background: rgba(255, 196, 64, .14); }
html[data-theme="dark"] .fm-kp-b { color: #9fb6cd; }

/* ==========================================================================
   KOYU TEMA — tamamlayıcı (2026-09-26, kullanıcı: "renkler cırtlamış")
   Açık temada sabit AÇIK renkle (#fff, pastel) yazılmış her yüzeyin koyu
   karşılığı. Kural: zemin = panel tonu ya da %16-22 şeffaf renk; yazı = aynı
   rengin AÇIK tonu. Beyaz/pastel kutu koyu temada HİÇ kalmaz.
   Yeni bir bileşene sabit açık renk yazarsan buraya karşılığını ekle.
   ========================================================================== */
/* Renk aileleri (rozet, takvim olayı, durum çipi) */
html[data-theme="dark"] .badge-live, html[data-theme="dark"] .badge-sec-g,
html[data-theme="dark"] .b-ok-c, html[data-theme="dark"] .qos-overview .qos-ok { background: rgba(76, 175, 120, .18); color: #8FD6AC; }
html[data-theme="dark"] .badge-danger, html[data-theme="dark"] .badge-sec-x, html[data-theme="dark"] .b-miss-c,
html[data-theme="dark"] .due-late, html[data-theme="dark"] .ev-df, html[data-theme="dark"] .qos-overview .qos-bad,
html[data-theme="dark"] .upc-item.u-red .upc-date { background: rgba(214, 69, 69, .2); color: #F0A0A0; }
html[data-theme="dark"] .badge-pending, html[data-theme="dark"] .badge-restricted, html[data-theme="dark"] .b-late-c,
html[data-theme="dark"] .due-soon, html[data-theme="dark"] .ev-gg, html[data-theme="dark"] .team-champion,
html[data-theme="dark"] .upc-item.u-warn .upc-date { background: rgba(217, 164, 65, .18); color: #E6C27E; }
html[data-theme="dark"] .badge-rev, html[data-theme="dark"] .badge-info-b, html[data-theme="dark"] .badge-sec-d,
html[data-theme="dark"] .b-open-c, html[data-theme="dark"] .ev-ys, html[data-theme="dark"] .upc-date,
html[data-theme="dark"] .team-member { background: rgba(150, 165, 190, .18); color: #C3CCDA; }
html[data-theme="dark"] .badge-cat, html[data-theme="dark"] .ev-dn { background: rgba(160, 130, 230, .18); color: #C9B8F2; }
html[data-theme="dark"] .ev-kl { background: rgba(60, 170, 160, .18); color: #8ED3CB; }
html[data-theme="dark"] .ev-ms { background: rgba(30, 159, 169, .18); color: #86D2D8; }
html[data-theme="dark"] .ev-sp { background: rgba(125, 144, 238, .18); color: #B6C1F5; }
html[data-theme="dark"] .ev-fm, html[data-theme="dark"] .team-leader { background: rgba(224, 105, 58, .18); color: #F2AC8A; }
html[data-theme="dark"] .qos-overview .qos-cell-edit:hover { background: rgba(255, 255, 255, .06); }
html[data-theme="dark"] .qos-overview .qos-cell-edit.qos-ok:hover { background: rgba(76, 175, 120, .28); }
html[data-theme="dark"] .qos-overview .qos-cell-edit.qos-bad:hover { background: rgba(214, 69, 69, .3); }
/* Düz renk zeminli (beyaz yazılı) öğeler: açık durum tonu değil, koyu-doygun ton */
html[data-theme="dark"] .toast-success, html[data-theme="dark"] .step-done .step-check,
html[data-theme="dark"] .fm-adimlar .ok b { background: #2E8B57; }
html[data-theme="dark"] .toast-error, html[data-theme="dark"] .kl-isaret.red,
html[data-theme="dark"] .notif-badge { background: #B84545; }
/* Beyaz/pastel yüzeyler → panel tonları */
html[data-theme="dark"] .side-collapse, html[data-theme="dark"] .chip, html[data-theme="dark"] .res-btn,
html[data-theme="dark"] .on-btn, html[data-theme="dark"] .yis-card, html[data-theme="dark"] .health-head,
html[data-theme="dark"] .ia-item, html[data-theme="dark"] .gc-suz-cip { background: var(--panel-2); }
html[data-theme="dark"] .on-btn:hover { background: #2B2F36; }
html[data-theme="dark"] .res-btn.active.res-na { background: rgba(255, 255, 255, .08); border-color: rgba(255, 255, 255, .25); color: #B5B7BD; }
html[data-theme="dark"] .btn-danger-o { background: transparent; color: #F0A0A0; border-color: rgba(229, 115, 115, .6); }
html[data-theme="dark"] .btn-danger-o:hover { background: rgba(214, 69, 69, .16); }
html[data-theme="dark"] .row-overdue { background: rgba(214, 69, 69, .1); }
html[data-theme="dark"] .progress, html[data-theme="dark"] .step-check { background: rgba(255, 255, 255, .1); }
html[data-theme="dark"] .on-ph-init { background: #2B2F36; color: #E6E5E2; }
html[data-theme="dark"] .pick-chip .chip-note { background: #17191D; color: var(--text); border-color: rgba(255, 255, 255, .2) !important; }
html[data-theme="dark"] .pal-tx mark { background: rgba(255, 200, 70, .3); color: inherit; }
/* Sistem Durumu: "Genel Durum" şeridi ve kartların sol çizgisi */
html[data-theme="dark"] .health-head, html[data-theme="dark"] .health-card { border-color: rgba(255, 255, 255, .1); }
html[data-theme="dark"] .health-head.health-ok { background: rgba(76, 175, 120, .14); border-color: rgba(76, 175, 120, .4); }
html[data-theme="dark"] .health-head.health-warn { background: rgba(217, 164, 65, .14); border-color: rgba(217, 164, 65, .42); }
html[data-theme="dark"] .health-head.health-crit { background: rgba(214, 69, 69, .15); border-color: rgba(214, 69, 69, .45); }
html[data-theme="dark"] .health-card.health-ok { border-left-color: #4CAF78; }
html[data-theme="dark"] .health-card.health-warn { border-left-color: #D9A441; }
html[data-theme="dark"] .health-card.health-crit { border-left-color: #D65A5A; }
/* Form: onay kutusu ve dosya seçici (color-scheme: dark ile birlikte) */
html[data-theme="dark"] input[type="checkbox"], html[data-theme="dark"] input[type="radio"] { background: transparent; }
html[data-theme="dark"] input[type="file"] { background: #17191D; color: var(--muted); border-color: var(--line); }
html[data-theme="dark"] input[type="file"]::file-selector-button {
  background: #2B2F36; color: #E6E5E2; border: 1px solid rgba(255, 255, 255, .15);
  border-radius: 6px; padding: 4px 10px; margin-right: 10px; cursor: pointer; font: inherit; font-weight: 600; }
html[data-theme="dark"] input[type="file"]::file-selector-button:hover { background: #363A42; }
/* Giriş ekranı (koyu tema): video sahnesi açık renkli çekildi; koyu temada
   renkleri TERS çevrilerek (invert + hue-rotate → turuncu turuncu kalır)
   koyu sahneye döner. Kart buzlu KOYU cam olur, marka beyaz işaretle durur.
   Ana sayfadaki küçük video kutusu da aynı dönüşümü alır. */
html[data-theme="dark"] .lv-loop, html[data-theme="dark"] .dash-loop { filter: invert(.9) hue-rotate(180deg); }
html[data-theme="dark"] .dash-anim { background: #1C1F24; }
html[data-theme="dark"] .lv-scrim { background: linear-gradient(90deg, transparent 42%, rgba(0, 0, 0, .18) 66%, rgba(0, 0, 0, .38) 100%); }
html[data-theme="dark"] .lv-brand .logo-mark { background: #2B2F36; box-shadow: 0 6px 18px rgba(0, 0, 0, .4); }
html[data-theme="dark"] .login-split .login-card { background: rgba(34, 37, 43, .9);
  border-color: rgba(255, 255, 255, .09);
  box-shadow: 0 26px 70px rgba(0, 0, 0, .5), 0 0 0 1px rgba(255, 255, 255, .06); }
@media (max-width: 900px) {
  html[data-theme="dark"] .lv-scrim { background: linear-gradient(180deg, transparent 0%, transparent 26%,
    rgba(0, 0, 0, .14) 46%, rgba(0, 0, 0, .32) 100%); }
}

/* Marka videosu: durdur / oynat düğmesi (giriş ekranında sağ üst köşe,
   ana sayfadaki kutuda kutunun sağ üstü — üzerine gelince belirginleşir). */
.mv-dugme { width: 30px; height: 30px; border-radius: 50%; padding: 0; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid rgba(43, 47, 54, .16); background: rgba(255, 255, 255, .82); color: #2B2F36;
  box-shadow: 0 2px 8px rgba(43, 47, 54, .14); transition: opacity .15s var(--ease), background .15s var(--ease); }
.mv-dugme:hover { background: #fff; }
.mv-dugme svg { width: 12px; height: 12px; fill: currentColor; display: block; }
.mv-dugme:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.lv-dugme { position: fixed; z-index: 3; top: 26px; right: 30px; opacity: .75; }
.lv-dugme:hover, .lv-dugme:focus-visible { opacity: 1; }
.dash-anim .mv-dugme { position: absolute; top: 7px; right: 7px; width: 26px; height: 26px; opacity: .4; }
.dash-anim:hover .mv-dugme, .dash-anim .mv-dugme:focus-visible { opacity: 1; }
html[data-theme="dark"] .mv-dugme { background: rgba(43, 47, 54, .85); color: #E6E5E2; border-color: rgba(255, 255, 255, .14); }
html[data-theme="dark"] .mv-dugme:hover { background: #363A42; }
@media (max-width: 900px) { .lv-dugme { top: 12px; right: 12px; } }

/* Değişiklik Yönetimi → ⚙ Soru Listesi düzenleyicisi */
.chg-soru-liste { margin: 0; padding: 0 4px 0 0; list-style: none; display: flex; flex-direction: column; gap: 6px;
  max-height: min(44vh, 440px); overflow-y: auto; }
.chg-soru-liste li { display: flex; align-items: center; gap: 8px; }
.chg-no { flex: 0 0 22px; text-align: right; color: var(--muted); font-weight: 700; font-size: 12px; font-variant-numeric: tabular-nums; }
.chg-soru-liste li > input { flex: 1; min-width: 0; }
.chg-soru-tus { display: inline-flex; gap: 4px; flex: none; }
.chg-soru-tus .btn { min-width: 30px; padding-left: 8px; padding-right: 8px; }
.chg-soru-ekle { display: flex; gap: 8px; align-items: center; padding-left: 30px; padding-right: 4px; }
.chg-soru-ekle input { flex: 1; min-width: 0; }

/* FMEA: parçaya özgü operasyon (kütüphanede yok, yalnız bu ürün dosyasında) */
.fm-ozel-op { display: inline-block; margin-left: 8px; padding: 1px 8px; border-radius: 10px; vertical-align: 1px;
  font-size: 10.5px; font-weight: 700; letter-spacing: .02em; white-space: nowrap;
  color: var(--accent); background: rgba(var(--accent-rgb) / .1); box-shadow: inset 0 0 0 1px rgba(var(--accent-rgb) / .35); }
.fm-sih-op h3 .fm-ozel-op { margin-left: 0; }
.fm-op-bos td { padding-top: 8px !important; padding-bottom: 8px !important; }
.fm-op-bos .btn { margin-left: 8px; }
html[data-theme="dark"] .fm-ozel-op { color: #F2AC8A; background: rgba(224, 105, 58, .14); box-shadow: inset 0 0 0 1px rgba(224, 105, 58, .4); }
/* Talep formundaki Evet / Hayır / N/A seçenekleri yan yana (alt alta dizilip her
   soruyu üç satıra yayıyordu) */
.chg-yanit { display: flex; gap: 14px; align-items: center; }
.chg-yanit label.row-inline { gap: 5px; font-weight: 500; }
.chg-yanit input[type="radio"] { width: auto; margin: 0; flex: none; }