/* ============================================================
   WEGS Müşteri Operasyonları Yönetim Paneli
   REFERANS SHELL + TASARIM SİSTEMİ
   Tüm yeni ekranlar bu dosyanın birebir kopyası üzerine kurulur.
   ============================================================ */
:root{
  --brand:#1274C5;
  --brand-soft:#E9F3FC;
  --accent:#23AAE1;
  --accent-soft:#E8F6FC;
  --navy:#0F3156;
  --ink:#0F3156;
  --muted:#5B7089;
  --line:#DFE7F0;
  --bg:#F4F7FA;
  --card:#FFFFFF;
  --success:#0FA968;  --success-soft:#E7F7EF;
  --warning:#B45309;  --warning-soft:#FFF4E0;
  --danger:#D93843;   --danger-soft:#FDECEE;
  --purple:#6E56CF;   --purple-soft:#F1EDFB;
  --shadow:0 1px 2px rgba(15,49,86,.04), 0 6px 16px rgba(15,49,86,.06);
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{
  font-family:Inter,-apple-system,sans-serif;
  -webkit-font-smoothing:antialiased;
  background:var(--bg);
  color:var(--ink);
  font-size:13.5px;
  font-weight:450;
  line-height:1.5;
}
a{color:var(--brand);text-decoration:none}
svg{display:block;flex-shrink:0}

/* ---------- SIDEBAR ---------- */
.sidebar{
  position:fixed;top:0;left:0;bottom:0;
  width:220px;
  background:linear-gradient(180deg,#134070 0%,#0F3156 48%,#0B2544 100%);
  display:flex;flex-direction:column;
  z-index:60;
  overflow-y:auto;
  box-shadow:2px 0 16px rgba(6,20,40,.12);
  transition:width .2s ease, transform .25s ease;
}
.logo{
  display:flex;align-items:center;justify-content:flex-start;
  padding:12px 16px 9px;
}
.logo-full{display:block;width:100%;max-width:164px;height:auto}
.logo-rail{display:none;width:34px;height:34px}
.logo-mark{
  width:28px;height:28px;border-radius:8px;
  background:linear-gradient(135deg,#1274C5 0%,#23AAE1 100%);
  box-shadow:0 2px 6px rgba(18,116,197,.35);
  color:#fff;font-size:14px;font-weight:750;
  display:flex;align-items:center;justify-content:center;
  letter-spacing:-.02em;flex-shrink:0;
}
.logo-text{color:#fff;font-size:16px;font-weight:700;letter-spacing:-.02em;white-space:nowrap}
.logo-text span{color:rgba(255,255,255,.5);font-size:11px;font-weight:500;display:block;letter-spacing:.02em;line-height:1.2}
.nav-group{padding:3px 0 2px}
.nav-group:first-of-type{padding-top:2px}
.nav-group + .nav-group{margin-top:5px;padding-top:8px;border-top:1px solid rgba(255,255,255,.08)}
.nav-group-title{display:none} /* grup başlıkları kaldırıldı; ayrım ince ayraçla */
/* Ölçek bir tık küçültüldü (17 Eyl 2026): 26 satırlık menü 1440x900'de 1110px
   yer kaplıyor, yani her açılışta kaydırma gerektiriyordu. Satır yüksekliği
   36px'ten ~30px'e indi; okunabilirlik sınırının altına inmemek için yazı
   12.5px'te, ikon 17px'te durduruldu. Mobil dokunma hedefleri (≤767px)
   ayrı kuralda ve küçültülmedi. */
.nav-item{
  position:relative;
  display:flex;align-items:center;gap:9px;
  margin:1px 9px;padding:6px 10px;
  border-radius:9px;
  color:rgba(255,255,255,.66);
  font-size:12.5px;font-weight:500;line-height:1.25;
  text-decoration:none;white-space:nowrap;
  transition:background .15s ease, color .15s ease;
}
.nav-item:hover{color:#fff;background:rgba(255,255,255,.07)}
.nav-item.active{
  background:linear-gradient(90deg,rgba(35,170,225,.22) 0%,rgba(35,170,225,.06) 100%);
  color:#fff;
  box-shadow:inset 0 0 0 1px rgba(35,170,225,.22);
}
.nav-item.active::before{
  content:"";position:absolute;left:-9px;top:50%;transform:translateY(-50%);
  width:3px;height:16px;border-radius:0 3px 3px 0;background:var(--accent);
}
.nav-item.active svg{stroke:var(--accent);opacity:1}
.nav-item svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;opacity:.85;flex-shrink:0}
.nav-label{overflow:hidden;text-overflow:ellipsis}
/* İnce koyu-tema kaydırma çubuğu */
.sidebar::-webkit-scrollbar{width:8px}
.sidebar::-webkit-scrollbar-thumb{background:rgba(255,255,255,.12);border-radius:8px;border:2px solid transparent;background-clip:padding-box}
.sidebar::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,.22);background-clip:padding-box}

/* ---------- HEADER ---------- */
.main{margin-left:220px;min-height:100vh;transition:margin .2s ease}
.header{
  position:sticky;top:0;z-index:50;
  height:64px;
  background:rgba(255,255,255,.82);
  backdrop-filter:saturate(180%) blur(14px);
  -webkit-backdrop-filter:saturate(180%) blur(14px);
  border-bottom:1px solid var(--line);
  box-shadow:0 1px 3px rgba(15,49,86,.04);
  display:flex;align-items:center;gap:16px;
  padding:0 24px;
}
.hamburger{display:none}
.header-titles{min-width:0}
.breadcrumb{font-size:11.5px;font-weight:500;color:var(--muted);line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.breadcrumb b{color:var(--brand);font-weight:600}
.page-title{font-size:16.5px;font-weight:700;letter-spacing:-.02em;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--navy)}
.header-right{margin-left:auto;display:flex;align-items:center;gap:8px}
.global-search{position:relative;margin-right:4px}
.global-search svg{position:absolute;left:12px;top:50%;transform:translateY(-50%);width:16px;height:16px;stroke:var(--muted);fill:none;stroke-width:1.6;stroke-linecap:round}
.global-search input{
  width:300px;height:40px;
  border:1px solid transparent;border-radius:11px;
  background:var(--bg);
  padding:0 14px 0 36px;
  font-family:inherit;font-size:13px;color:var(--ink);
  transition:background .15s, border-color .15s, box-shadow .15s;
}
.global-search input::placeholder{color:var(--muted)}
.global-search input:focus{outline:none;background:#fff;border-color:var(--brand);box-shadow:0 0 0 3px rgba(18,116,197,.12)}
.icon-btn{
  width:40px;height:40px;border-radius:11px;
  border:1px solid transparent;background:transparent;
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;position:relative;transition:background .15s, color .15s;
}
.icon-btn:hover{background:var(--bg)}
.icon-btn svg{width:19px;height:19px;stroke:var(--muted);fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.icon-btn:hover svg{stroke:var(--ink)}
.icon-btn .dot{position:absolute;top:9px;right:10px;width:7px;height:7px;border-radius:50%;background:var(--danger);border:1.5px solid #fff}
.search-icon-btn{display:none}
.user-chip{display:flex;align-items:center;gap:9px;padding-left:14px;margin-left:6px;border-left:1px solid var(--line)}
.monogram{
  width:34px;height:34px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:12px;font-weight:650;color:#fff;flex-shrink:0;
  box-shadow:0 1px 3px rgba(15,49,86,.18);
}
.user-meta{line-height:1.25;text-decoration:none}
.user-name{font-size:12.5px;font-weight:650;color:var(--ink)}
.user-role{font-size:11px;font-weight:500;color:var(--muted)}

/* ---------- İÇERİK ---------- */
.content{padding:24px;max-width:1440px}
.section{margin-bottom:32px}
.section-head{margin-bottom:16px}
.section-title{font-size:15px;font-weight:650;letter-spacing:-.01em}
.section-desc{font-size:12px;font-weight:500;color:var(--muted);margin-top:2px}
.card{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:12px;
  padding:20px;
  box-shadow:var(--shadow);
}
.page-head{margin-bottom:24px}
.page-head h1{font-size:22px;font-weight:700;letter-spacing:-.02em;line-height:1.2}
.page-head p{font-size:12px;font-weight:500;color:var(--muted);margin-top:4px;max-width:720px}

/* ---------- RENK PALETİ ---------- */
.swatch-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.swatch{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--card)}
.swatch-color{height:56px}
.swatch-info{padding:8px 12px 10px}
.swatch-name{font-size:12.5px;font-weight:600}
.swatch-hex{font-size:11px;font-weight:500;color:var(--muted);letter-spacing:.02em}

/* ---------- TİPOGRAFİ ---------- */
.type-row{display:flex;align-items:baseline;gap:20px;padding:12px 0;border-bottom:1px solid var(--line)}
.type-row:last-child{border-bottom:none}
.type-spec{width:190px;flex-shrink:0;font-size:11px;font-weight:500;color:var(--muted);letter-spacing:.02em}
.t-page{font-size:22px;font-weight:700;letter-spacing:-.02em;line-height:1.2}
.t-section{font-size:15px;font-weight:650;line-height:1.2}
.t-body{font-size:13.5px;font-weight:450;line-height:1.5}
.t-label{font-size:12px;font-weight:500;color:var(--muted);line-height:1.5}
.t-kpi{font-size:26px;font-weight:750;letter-spacing:-.02em;line-height:1.2}
.t-badge{font-size:12.5px;font-weight:600;line-height:1.5}

/* ---------- BUTONLAR ---------- */
.btn{
  height:36px;padding:0 14px;
  border-radius:8px;border:1px solid transparent;
  font-family:inherit;font-size:12.5px;font-weight:600;
  display:inline-flex;align-items:center;gap:6px;
  cursor:pointer;white-space:nowrap;
}
.btn svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round}
.btn-primary{background:linear-gradient(180deg,#1A82D6 0%,var(--brand) 100%);color:#fff;box-shadow:0 1px 2px rgba(18,116,197,.35)}
.btn-secondary{background:var(--card);color:var(--ink);border-color:var(--line)}
.btn-danger{background:var(--danger);color:#fff}
.btn-ghost{background:transparent;color:var(--brand)}
/* Yıkıcı işlemin hafif düğmesi (kart/satırdaki "Sil"). Sınıfta "danger"
   geçmesi onay penceresinin kırmızı düğmeyle açılmasını da sağlıyor. */
.btn-ghost.danger{color:var(--danger)}
.btn-ghost.danger:hover{background:var(--danger-soft)}
.btn:disabled{opacity:.45;cursor:not-allowed}
.demo-row{display:flex;flex-wrap:wrap;gap:12px;align-items:center}

/* ---------- FORM ---------- */
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.field label{display:block;font-size:12px;font-weight:500;color:var(--muted);margin-bottom:6px}
.field label b{color:var(--danger);font-weight:600}
.input,.select{
  width:100%;height:36px;
  border:1px solid var(--line);border-radius:8px;
  background:var(--card);
  padding:0 12px;
  font-family:inherit;font-size:13px;color:var(--ink);
}
.input::placeholder{color:var(--muted)}
.input:focus,.select:focus{outline:none;border-color:var(--brand)}
.input.is-focus{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}
.input.is-error{border-color:var(--danger)}
.field-help{font-size:11px;font-weight:500;color:var(--muted);margin-top:4px}
.field-error{font-size:11px;font-weight:500;color:var(--danger);margin-top:4px}
.select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 20 20' fill='none' stroke='%235B7089' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 8l5 5 5-5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;padding-right:32px}

/* ---------- BADGE ---------- */
.badge{
  display:inline-flex;align-items:center;gap:5px;
  padding:3px 10px;border-radius:999px;
  font-size:12.5px;font-weight:600;white-space:nowrap;
}
.badge i{width:6px;height:6px;border-radius:50%;background:currentColor;flex-shrink:0}
.badge-success{background:var(--success-soft);color:var(--success)}
.badge-warning{background:var(--warning-soft);color:var(--warning)}
.badge-danger{background:var(--danger-soft);color:var(--danger)}
.badge-brand{background:var(--brand-soft);color:var(--brand)}
.badge-accent{background:var(--accent-soft);color:var(--accent)}
.badge-purple{background:var(--purple-soft);color:var(--purple)}
.badge-neutral{background:var(--bg);color:var(--muted)}

/* ---------- KPI ---------- */
.kpi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}
.kpi-card{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:20px;box-shadow:var(--shadow)}
.kpi-top{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;margin-bottom:2px}
.kpi-icon{width:36px;height:36px;border-radius:10px;background:var(--brand-soft);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.kpi-icon svg{width:18px;height:18px;stroke:var(--brand);fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.kpi-icon.k-accent{background:var(--accent-soft)}
.kpi-icon.k-accent svg{stroke:var(--accent)}
.kpi-icon.k-warning{background:var(--warning-soft)}
.kpi-icon.k-warning svg{stroke:var(--warning)}
.kpi-icon.k-danger{background:var(--danger-soft)}
.kpi-icon.k-danger svg{stroke:var(--danger)}
.kpi-label{font-size:12px;font-weight:500;color:var(--muted)}
.kpi-value{font-size:26px;font-weight:750;letter-spacing:-.02em;margin:6px 0 8px;line-height:1.2}
.kpi-delta{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:500}
.kpi-delta b{font-weight:650}
.delta-up{color:var(--success)}
.delta-down{color:var(--danger)}
.kpi-delta span{color:var(--muted)}

/* ---------- FİLTRE ÇUBUĞU ---------- */
.filter-bar{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-bottom:16px}
.filter-search{position:relative;flex:1 1 240px;max-width:320px}
.filter-search svg{position:absolute;left:10px;top:50%;transform:translateY(-50%);width:16px;height:16px;stroke:var(--muted);fill:none;stroke-width:1.5;stroke-linecap:round}
.filter-search input{width:100%;height:36px;border:1px solid var(--line);border-radius:8px;background:var(--card);padding:0 12px 0 32px;font-family:inherit;font-size:13px}
.filter-search input::placeholder{color:var(--muted)}
.filter-search input:focus{outline:none;border-color:var(--brand)}
.filter-select{height:36px;border:1px solid var(--line);border-radius:8px;background:var(--card);padding:0 32px 0 12px;font-family:inherit;font-size:13px;color:var(--ink);appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 20 20' fill='none' stroke='%235B7089' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 8l5 5 5-5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center}
.filters-btn{display:none}
.filters-btn .count{background:var(--brand);color:#fff;font-size:11px;font-weight:650;min-width:18px;height:18px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;padding:0 5px}
.filter-spacer{flex:1}

/* ---------- TABLO ---------- */
.table-card{background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);overflow:hidden}
.table-scroll{overflow-x:auto}
table{width:100%;border-collapse:collapse;min-width:860px}
thead th{
  background:#F8FAFD;
  font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;
  color:var(--muted);text-align:left;
  padding:12px 16px;border-bottom:1px solid var(--line);white-space:nowrap;
}
tbody td{padding:12px 16px;border-bottom:1px solid var(--line);vertical-align:middle}
tbody tr:last-child td{border-bottom:none}
tbody tr:hover{background:var(--brand-soft)}
.cust{display:flex;align-items:center;gap:12px;min-width:220px}
.cust-meta{line-height:1.3;min-width:0}
.cust-name{font-weight:600;font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:260px}
.cust-sub{font-size:12px;font-weight:500;color:var(--muted)}
/* Boş liste altındaki yönlendirme notu (ör. "kayıt arşivde"). */
.empty-not{margin-top:6px;font-size:13px;color:var(--muted)}
.empty-not a{color:var(--brand);font-weight:600}

/* Arama eşleşme notu: satır, aranan metni görünür şekilde içermiyorsa
   (kayıt bağlı bir alandan bulunduysa) nedenini söyleyen küçük etiket. */
.arama-not{
  display:inline-flex;align-items:center;gap:4px;margin-left:6px;
  padding:1px 7px;border-radius:999px;border:1px solid var(--brand-soft);
  background:var(--brand-soft);color:var(--brand);
  font-size:11px;font-weight:600;white-space:nowrap;cursor:help;
}
.num{font-variant-numeric:tabular-nums;font-weight:600}
.row-action{
  width:32px;height:32px;border-radius:8px;border:none;background:transparent;
  color:var(--muted);font-size:16px;font-weight:700;cursor:pointer;line-height:1;
}
.row-action:hover{background:var(--bg);color:var(--ink)}
/* Etiketli tetikleyici: .row-action 32px'lik "⋯" düğmesi için tasarlandı;
   yanına metin konduğunda kutuyu taşırıyordu. .btn ile birlikte kullanıldığında
   ölçüsünü içeriğe bırakır. */
.row-action.btn{width:auto;height:auto;border:1px solid var(--line);
  background:var(--card);color:var(--ink);font-size:12.5px;font-weight:600}
.row-action.btn:hover{border-color:var(--brand);color:var(--brand);background:var(--card)}
.td-action{text-align:right;width:48px}

/* monogram renkleri (yalnızca palet) */
.mg-brand{background:var(--brand)}
.mg-accent{background:var(--accent)}
.mg-navy{background:var(--navy)}
.mg-purple{background:var(--purple)}
.mg-success{background:var(--success)}
.mg-warning{background:var(--warning)}
.mg-danger{background:var(--danger)}

/* ---------- NOT KUTUSU ---------- */
.note{
  border:1px solid var(--line);border-left:3px solid var(--brand);
  background:var(--brand-soft);border-radius:8px;
  padding:12px 16px;font-size:12.5px;font-weight:500;color:var(--ink);
}

/* ---------- SEKMELER ---------- */
.tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);overflow-x:auto}
.tab{
  padding:10px 14px;border:none;background:transparent;cursor:pointer;
  font-family:inherit;font-size:13px;font-weight:600;color:var(--muted);
  border-bottom:2px solid transparent;margin-bottom:-1px;white-space:nowrap;
  display:inline-flex;align-items:center;gap:6px;
}
.tab:hover{color:var(--ink)}
.tab.active{color:var(--brand);border-bottom-color:var(--brand)}
.tab .cnt{
  background:var(--bg);color:var(--muted);
  font-size:11px;font-weight:650;
  min-width:18px;height:18px;border-radius:999px;
  display:inline-flex;align-items:center;justify-content:center;padding:0 5px;
}
.tab.active .cnt{background:var(--brand-soft);color:var(--brand)}
.tab-panel{padding:16px 0 0;font-size:13.5px;color:var(--muted)}

/* ---------- SEÇİM KONTROLLERİ ---------- */
.check-row{display:flex;flex-wrap:wrap;gap:24px;align-items:center}
.check-item{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:500;cursor:pointer}
.check-item input{width:16px;height:16px;accent-color:var(--brand);cursor:pointer}
.switch{
  width:36px;height:20px;border-radius:999px;background:var(--line);
  position:relative;flex-shrink:0;transition:background .15s;
}
.switch::after{
  content:"";position:absolute;top:2px;left:2px;
  width:16px;height:16px;border-radius:50%;background:#fff;
  box-shadow:0 1px 2px rgba(15,49,86,.2);transition:left .15s;
}
.switch.on{background:var(--brand)}
.switch.on::after{left:18px}

/* ---------- UYARI KUTULARI ---------- */
.alert{
  display:flex;gap:10px;align-items:flex-start;
  border:1px solid var(--line);border-left:3px solid;
  border-radius:8px;padding:12px 16px;
  font-size:12.5px;font-weight:500;line-height:1.5;
}
.alert svg{width:18px;height:18px;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;margin-top:1px}
.alert b{font-weight:650;display:block;margin-bottom:1px}
/* Cümle içinde vurgu: blok yapıp satır kırmasın (uyarı metinleri). */
.alert p b,.alert span b,.alert b.inline{display:inline;margin-bottom:0}
/* Gövde içindeki vurgular satır içinde kalsın. ".alert b" blok olduğu için
   cümle ortasındaki her <b> satır atlatıyor ve cümleyi parçalara bölüyordu;
   bu oturumda iki ayrı ekranda aynı hata yazıldı. Kural şablonu değil yapıyı
   hedefliyor: yalnız İLK <b> başlık sayılır, sonrakiler cümlenin parçasıdır. */
.alert > div > b:not(:first-child){display:inline;margin-bottom:0}
.alert-info{background:var(--brand-soft);border-left-color:var(--brand)}
.alert-info svg{stroke:var(--brand)}
.alert-success{background:var(--success-soft);border-left-color:var(--success)}
.alert-success svg{stroke:var(--success)}
.alert-warning{background:var(--warning-soft);border-left-color:var(--warning)}
.alert-warning svg{stroke:var(--warning)}
.alert-danger{background:var(--danger-soft);border-left-color:var(--danger)}
.alert-danger svg{stroke:var(--danger)}
.alert-stack{display:flex;flex-direction:column;gap:12px}

/* ---------- PROGRESS ---------- */
.progress-item{margin-bottom:16px}
.progress-item:last-child{margin-bottom:0}
.progress-head{display:flex;justify-content:space-between;font-size:12px;font-weight:500;color:var(--muted);margin-bottom:6px}
.progress-head b{color:var(--ink);font-weight:600}
.progress{height:8px;border-radius:999px;background:var(--bg);border:1px solid var(--line);overflow:hidden}
.progress i{display:block;height:100%;border-radius:999px;background:var(--brand)}
.progress i.p-success{background:var(--success)}
.progress i.p-warning{background:var(--warning)}

/* ---------- GRAFİKLER ---------- */
.chart-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px}
.chart-card{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:20px;box-shadow:var(--shadow)}
.chart-title{font-size:15px;font-weight:650;letter-spacing:-.01em}
.chart-sub{font-size:12px;font-weight:500;color:var(--muted);margin:2px 0 12px}
.chart-card svg{width:100%;height:auto}
.legend{display:flex;flex-wrap:wrap;gap:14px;margin-top:12px}
.legend-item{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:500;color:var(--muted)}
.legend-item i{width:10px;height:10px;border-radius:3px;flex-shrink:0}
.chart-axis{font-size:9px;font-weight:500;fill:var(--muted);font-family:Inter,-apple-system,sans-serif}
.donut-wrap{display:flex;align-items:center;gap:20px}
.donut-center{font-size:20px;font-weight:750;letter-spacing:-.02em;fill:var(--ink);font-family:Inter,-apple-system,sans-serif}
.donut-center-sub{font-size:9px;font-weight:500;fill:var(--muted);font-family:Inter,-apple-system,sans-serif}

/* ---------- PAGINATION ---------- */
.pagination{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.page-btn{
  min-width:32px;height:32px;padding:0 8px;
  border:1px solid var(--line);border-radius:8px;background:var(--card);
  font-family:inherit;font-size:12.5px;font-weight:600;color:var(--muted);cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;
}
.page-btn svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.page-btn:hover{border-color:var(--brand);color:var(--brand)}
.page-btn.active{background:var(--brand);border-color:var(--brand);color:#fff}
.page-btn:disabled{opacity:.45;cursor:not-allowed}
.page-info{font-size:12px;font-weight:500;color:var(--muted);margin-right:8px}

/* ---------- STEPPER ---------- */
.stepper{display:flex;align-items:center;gap:8px}
.step{display:flex;align-items:center;gap:8px;flex-shrink:0}
.step-dot{
  width:28px;height:28px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:12px;font-weight:650;flex-shrink:0;
  border:1.5px solid var(--line);background:var(--card);color:var(--muted);
}
.step-dot svg{width:14px;height:14px;stroke:#fff;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.step.done .step-dot{background:var(--success);border-color:var(--success)}
.step.current .step-dot{background:var(--brand);border-color:var(--brand);color:#fff}
.step-label{font-size:12.5px;font-weight:600;color:var(--muted);white-space:nowrap}
.step.done .step-label{color:var(--ink)}
.step.current .step-label{color:var(--brand)}
.step-line{flex:1;height:1.5px;background:var(--line);min-width:24px}
.step-line.done{background:var(--success)}

/* ---------- DROPDOWN (açık örnek) ---------- */
.dropdown{
  width:208px;background:var(--card);
  border:1px solid var(--line);border-radius:8px;
  box-shadow:var(--shadow);padding:6px;
}
.dd-item{
  display:flex;align-items:center;gap:8px;
  padding:8px 10px;border-radius:6px;
  font-size:13px;font-weight:500;color:var(--ink);cursor:pointer;
}
.dd-item svg{width:16px;height:16px;stroke:var(--muted);fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.dd-item:hover{background:var(--brand-soft)}
.dropdown form{margin:0}
button.dd-item{width:100%;border:0;background:none;text-align:left;font-family:inherit}
.dd-item.danger{color:var(--danger)}
.dd-item.danger:hover{background:var(--danger-soft)}
.dd-item.danger svg{stroke:var(--danger)}
.dd-sep{height:1px;background:var(--line);margin:4px 6px}

/* ---------- MODAL (statik örnek) ---------- */
.modal-demo-bg{
  background:rgba(15,49,86,.45);
  border-radius:12px;padding:32px 16px;
  display:flex;justify-content:center;
}
.modal{
  width:100%;max-width:420px;
  background:var(--card);border-radius:16px;
  box-shadow:0 1px 3px rgba(15,49,86,.06);
  padding:24px;
}
.modal-title{font-size:15px;font-weight:650;letter-spacing:-.01em;margin-bottom:4px}
.modal-desc{font-size:13.5px;color:var(--muted);line-height:1.5;margin-bottom:20px}
.modal-desc b{color:var(--ink);font-weight:600}
.modal-actions{display:flex;justify-content:flex-end;gap:12px}

/* ---------- BOŞ DURUM ---------- */
.empty{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;padding:32px 20px;
}
.empty-icon{
  width:48px;height:48px;border-radius:12px;
  background:var(--brand-soft);
  display:flex;align-items:center;justify-content:center;margin-bottom:12px;
}
.empty-icon svg{width:24px;height:24px;stroke:var(--brand);fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.empty p{font-size:13.5px;color:var(--muted);margin-bottom:16px;max-width:320px}

/* ---------- AVATAR BOYUTLARI ---------- */
.mg-sm{width:24px;height:24px;font-size:10px}
.mg-lg{width:40px;height:40px;font-size:14px}

/* Yeni componentler için mobil düzenlemeler */
@media (max-width:767px){
  .stepper{flex-direction:column;align-items:flex-start;gap:12px}
  .step-line{display:none}
  .donut-wrap{flex-direction:column;align-items:flex-start}
  .modal-actions .btn{flex:1}
}

/* ============================================================
   RESPONSIVE — TABLET (768–1199px)
   ============================================================ */
@media (max-width:1199px){
  .sidebar{width:64px}
  .main{margin-left:64px}
  .logo{padding:18px 0 14px;justify-content:center}
  .logo-text{display:none}
  .logo-full{display:none}
  .logo-rail{display:block}
  .nav-group-title{padding:8px 0 6px;text-align:center;font-size:9px;letter-spacing:.06em}
  .nav-item{justify-content:center;padding:10px 0;margin:2px 8px}
  .nav-item.active::before{display:none}
  .nav-item .nav-label{display:none}
  .global-search input{width:210px}
}

/* ============================================================
   RESPONSIVE — MOBİL (≤767px)
   ============================================================ */
@media (max-width:767px){
  /* Sidebar → drawer */
  .sidebar{width:264px;transform:translateX(-100%)}
  #nav-toggle:checked ~ .sidebar{transform:translateX(0)}
  .main{margin-left:0}
  .logo{padding:20px 16px 16px;justify-content:flex-start}
  .logo-text{display:block}
  .nav-group-title{padding:8px 16px 6px;text-align:left;font-size:11px;letter-spacing:.08em}
  .nav-item{justify-content:flex-start;padding:12px 16px 12px 13px;min-height:44px}
  .nav-item .nav-label{display:block}
  .overlay{
    display:none;position:fixed;inset:0;background:rgba(15,49,86,.45);z-index:55;
  }
  #nav-toggle:checked ~ .overlay{display:block}

  .header{padding:0 16px;gap:12px}
  .hamburger{
    display:flex;align-items:center;justify-content:center;
    width:44px;height:44px;margin-left:-8px;border-radius:8px;cursor:pointer;flex-shrink:0;
  }
  .hamburger svg{width:22px;height:22px;stroke:var(--ink);fill:none;stroke-width:1.5;stroke-linecap:round}
  .global-search{display:none}
  .search-icon-btn{display:flex;min-width:44px;min-height:44px}
  .icon-btn{min-width:44px;min-height:44px}
  .user-meta{display:none}
  .breadcrumb{display:none}
  /* Ekranın kendi H1'i varsa üst şeritteki başlığı tekrarlama. 390px'lik
     başlıkta hamburger + dört ikon yanında başlığa 34px kalıyor ve "Leadler"
     tek harfe ("L…") kırpılıyordu. :has desteklemeyen tarayıcıda eski
     davranış sürer. Detay sayfalarının H1'i yok ama .ctx-bar başlığı aynı
     işi görüyor — orada da tekrar etmesin: workspace detayında başlık
     "M…" diye tek harfe kırpılıyordu. */
  body:has(.page-head h1) .page-title,
  body:has(.ctx-bar .ctx-name) .page-title{display:none}

  .content{padding:16px}
  .card{padding:16px}
  .form-grid{grid-template-columns:1fr}
  .demo-row .btn{flex:1 1 100%;justify-content:center;min-height:44px}
  .btn{min-height:44px}
  .type-row{flex-direction:column;gap:4px;align-items:flex-start}
  .type-spec{width:auto}

  /* Filtre çubuğu */
  .filter-select{display:none}
  .filters-btn{display:inline-flex;min-height:44px}
  .filter-search{max-width:none;flex:1 1 100%}
  .filter-search input{height:44px}
  .filter-bar .btn-primary{flex:1 1 auto}

  /* Tablo → kart görünümü */
  .table-card{background:transparent;border:none;box-shadow:none;overflow:visible}
  .table-scroll{overflow:visible}
  table{min-width:0;display:block}
  thead{display:none}
  tbody{display:block}
  tbody tr{
    display:block;position:relative;
    background:var(--card);border:1px solid var(--line);border-radius:12px;
    box-shadow:var(--shadow);
    padding:16px;margin-bottom:12px;
  }
  tbody tr:hover{background:var(--card)}
  tbody td{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:5px 0;border-bottom:none}
  tbody td[data-label]::before{
    content:attr(data-label);
    font-size:12px;font-weight:500;color:var(--muted);flex-shrink:0;
  }
  .td-cust{padding:0 40px 10px 0;margin-bottom:8px;border-bottom:1px solid var(--line)}
  .td-action{position:absolute;top:10px;right:10px;width:auto;padding:0}
  .row-action{width:44px;height:44px}

  /* BELGELER kart görünümüne dönmez.
     Yukarıdaki kurallar "table" seçicisiyle yazılmış ve müşteriye giden
     belgelerin (teklif, fatura, ekstre, paket listesi) kalem tablolarını da
     yakalıyordu. Asıl etkisi YAZDIRMADA görülüyor: tarayıcı yazdırırken
     sayfayı kâğıt genişliğinde çiziyor ve A4'ün kullanılabilir genişliği
     (kenar boşluklarıyla ~660px) bu eşiğin altında kalıyor — teklif kalem
     tablosu tek sütuna yığılıyor, ürün/dönem/adet/fiyat alt alta düşüyordu.
     Belge bir liste ekranı değil; her genişlikte tablo kalmalı. */
  .pdfdoc table{display:table; width:100%}
  .pdfdoc thead{display:table-header-group}
  .pdfdoc tbody{display:table-row-group}
  .pdfdoc tbody tr{
    display:table-row; position:static;
    background:none; border:0; border-radius:0; box-shadow:none;
    padding:0; margin:0;
  }
  .pdfdoc tbody td{
    display:table-cell; justify-content:initial; align-items:initial; gap:0;
  }
  .pdfdoc tbody td[data-label]::before{content:none}
  .pdfdoc .td-cust{padding:inherit; margin:0; border-bottom:inherit}
  .pdfdoc .td-action{position:static; padding:inherit}
}

/* ============================================================
   v0.2 EKLERİ — MÜŞTERİ MODÜLÜNDE DOĞAN COMPONENTLER
   ============================================================ */

/* Textarea (form setine ek) */
.textarea{
  width:100%;min-height:88px;
  border:1px solid var(--line);border-radius:8px;
  background:var(--card);padding:10px 12px;
  font-family:inherit;font-size:13px;color:var(--ink);resize:vertical;
}
.textarea::placeholder{color:var(--muted)}
.textarea:focus{outline:none;border-color:var(--brand)}
.form-actions{display:flex;justify-content:flex-end;gap:12px}
.sticky-col{position:sticky;top:84px}

/* Dropdown başlığı (kolon menüsü için) */
.dd-title{padding:6px 10px 4px;font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.col-menu{position:relative}
.col-menu .dropdown{position:absolute;top:44px;right:0;z-index:40}

/* Tablo ekleri */
.cell-sub{display:block;font-size:12px;font-weight:500;color:var(--muted)}
tbody tr.row-selected{background:var(--brand-soft)}
tbody tr.row-selected td:first-child{box-shadow:inset 3px 0 0 var(--brand)}
.table-foot{display:flex;align-items:center;gap:6px;flex-wrap:wrap;padding:12px 16px;border-top:1px solid var(--line)}

/* Mini tablo (kart içi) */
.mini-table{width:100%;border-collapse:collapse;min-width:0}
/* Seçilebilir satırlarda içerik, vurgu bandının kenarına yapışmasın. */
.mini-table tbody tr.row-link > td:first-child{padding-left:10px}
.mini-table tbody tr.row-link > td:last-child{padding-right:10px}
.mini-table th{
  background:transparent;
  font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;
  color:var(--muted);text-align:left;
  padding:0 12px 10px 0;border-bottom:1px solid var(--line);white-space:nowrap;
}
.mini-table td{padding:12px 12px 12px 0;border-bottom:1px solid var(--line);vertical-align:middle}
.mini-table tr:last-child td{border-bottom:none}
.mini-table tbody tr:hover{background:transparent}

/* Sağlık skoru: rakam + mini bar */
.health{display:flex;align-items:center;gap:8px}
.health b{font-size:13px;font-weight:650;font-variant-numeric:tabular-nums;min-width:22px}
.hbar{width:56px;height:6px;border-radius:999px;background:var(--bg);border:1px solid var(--line);overflow:hidden;flex-shrink:0}
.hbar i{display:block;height:100%;border-radius:999px;background:var(--success)}
.hbar i.h-warning{background:var(--warning)}
.hbar i.h-danger{background:var(--danger)}

/* Ürün çipleri */
.chips{display:flex;gap:4px;flex-wrap:wrap}
.chip{
  display:inline-flex;align-items:center;
  padding:2px 8px;border-radius:6px;
  background:var(--bg);border:1px solid var(--line);
  font-size:11px;font-weight:600;color:var(--muted);white-space:nowrap;
}

/* Sahip hücresi */
.owner{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:500;white-space:nowrap}

/* Kişi kartı */
.person{display:flex;align-items:flex-start;gap:12px;padding:12px 0;border-bottom:1px solid var(--line)}
.person:first-of-type{padding-top:0}
.person:last-of-type{border-bottom:none;padding-bottom:0}
.person-meta{min-width:0;line-height:1.35}
.person-name{font-size:13.5px;font-weight:600;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.person-name .badge{font-size:11px;padding:1px 8px}
.person-role{font-size:12px;font-weight:500;color:var(--muted)}
.person-contact{font-size:12px;font-weight:500;color:var(--muted);margin-top:2px}

/* Bilgi satırı */
.info-row{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid var(--line);font-size:13px}
.info-row:first-of-type{padding-top:0}
.info-row:last-of-type{border-bottom:none;padding-bottom:0}
.info-row .lbl{font-weight:500;color:var(--muted);flex-shrink:0}
.info-row .val{font-weight:600;text-align:right}
/* Değerin yanındaki eylem düğmeleri (kopyala, göster) alt satıra düşmesin:
   satır iki katına çıkıyor ve künye okunmaz hâle geliyordu. */
.info-row .val:has(.btn-icon){display:flex;align-items:center;justify-content:flex-end;gap:4px;flex-wrap:wrap}
.info-row .val .btn-icon{width:26px;height:26px;flex-shrink:0}
.info-row .val .btn-icon svg{width:14px;height:14px}

/* Geri bağlantısı */
.back-link{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600;color:var(--brand);margin-bottom:16px}
.back-link svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}

/* Müşteri başlık kartı */
.cust-header{display:flex;align-items:flex-start;gap:16px;flex-wrap:wrap;margin-bottom:24px}
.cust-header > .monogram{width:48px;height:48px;font-size:16px}
.cust-head-meta{min-width:0;flex:1 1 260px}
.cust-head-name{font-size:18px;font-weight:700;letter-spacing:-.02em;line-height:1.25}
.cust-head-sub{font-size:12px;font-weight:500;color:var(--muted);margin-top:2px}
.cust-head-badges{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.cust-head-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-left:auto}
.cust-owner{
  display:flex;align-items:center;gap:8px;
  padding:0 12px;height:36px;
  border:1px solid var(--line);border-radius:8px;background:var(--bg);
  font-size:12.5px;font-weight:600;white-space:nowrap;
}
.cust-owner span{font-size:11px;font-weight:500;color:var(--muted);display:block;line-height:1.2}
.icon-action{
  width:36px;height:36px;border-radius:8px;border:1px solid var(--line);background:var(--card);
  color:var(--muted);font-size:16px;font-weight:700;cursor:pointer;line-height:1;
}
.icon-action:hover{background:var(--bg);color:var(--ink)}

/* Sekme sayacı — uyarı hali */
.tab .cnt-danger{background:var(--danger-soft);color:var(--danger)}
.tab .cnt-warn{background:var(--warning-soft);color:var(--warning)}

/* AI kartı (purple) */
.ai-card{border-left:3px solid var(--purple)}
.ai-title{display:flex;align-items:center;gap:8px}
.ai-chip{width:28px;height:28px;border-radius:8px;background:var(--purple-soft);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.ai-chip svg{width:16px;height:16px;stroke:var(--purple);fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.ai-actions{margin-top:12px;display:flex;flex-direction:column;gap:8px}
.ai-action{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid var(--line);border-radius:8px;font-size:12.5px;font-weight:500}
.ai-action svg{width:16px;height:16px;stroke:var(--purple);fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.ai-action .btn{margin-left:auto;height:28px;padding:0 10px;font-size:12px}

/* Zaman çizelgesi */
.tl{position:relative;padding-left:20px}
.tl::before{content:"";position:absolute;left:5px;top:6px;bottom:6px;width:1.5px;background:var(--line)}
.tl-item{position:relative;padding-bottom:16px}
.tl-item:last-child{padding-bottom:0}
.tl-dot{
  position:absolute;left:-20px;top:4px;
  width:11px;height:11px;border-radius:50%;
  background:var(--brand);border:2px solid var(--card);
  box-shadow:0 0 0 1.5px var(--line);
}
.tl-dot.tl-success{background:var(--success)}
.tl-dot.tl-warning{background:var(--warning)}
.tl-dot.tl-danger{background:var(--danger)}
.tl-dot.tl-accent{background:var(--accent)}
.tl-dot.tl-purple{background:var(--purple)}
.tl-dot.tl-muted{background:var(--muted)}
.tl-time{font-size:12px;font-weight:500;color:var(--muted);display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.tl-time .badge{font-size:11px;padding:1px 8px}
.tl-text{font-size:13.5px;margin-top:1px}
.tl-text b{font-weight:600}

/* Detay grid'i */
.detail-grid{display:grid;grid-template-columns:1.6fr 1fr;gap:16px;align-items:start}
/* Izgara ve esnek kutu çocukları varsayılan min-width:auto taşır: içindeki en
   geniş öğenin min-content genişliği (burada .mini-table'ın 520px'i) sütunu
   şişirir ve sayfa mobilde yana kayar. Sütun daralabilmeli, tablo kendi
   içinde kaysın. Aynı kusur .form-layout'ta da çıkmıştı. */
.detail-grid > *{min-width:0}
.detail-col{display:flex;flex-direction:column;gap:16px}
.detail-col > *{min-width:0}
/* Ağırlık sağdaki kartta olan ekranlar: soldaki liste dar, sağdaki künye
   geniş. Varsayılan 1.6fr/1fr, üç dar sütunluk bir listeye gereğinden fazla
   yer verip künyeyi sıkıştırıyordu. */
.detail-grid.dg-ters{grid-template-columns:1fr 1fr}
@media (max-width:900px){.detail-grid.dg-ters{grid-template-columns:1fr}}

/* Slide-over */
.so-overlay{position:fixed;inset:0;background:rgba(15,49,86,.20);z-index:70}
/* E-posta paneli daha geniş: içinde 560 piksellik ileti önizlemesi var,
   420 pikselde okunacak gibi değil. */
#so-eposta{width:min(680px,96vw)}
.slideover{
  position:fixed;top:0;right:0;bottom:0;width:420px;
  background:var(--card);z-index:75;
  box-shadow:-8px 0 32px rgba(15,49,86,.14);
  display:flex;flex-direction:column;
}
.so-head{display:flex;align-items:flex-start;gap:12px;padding:20px;border-bottom:1px solid var(--line)}
.so-title{font-size:15px;font-weight:650;letter-spacing:-.01em;line-height:1.3}
.so-sub{font-size:12px;font-weight:500;color:var(--muted);margin-top:2px}
.so-back{display:none}
.so-close{
  margin-left:auto;width:32px;height:32px;border-radius:8px;
  border:none;background:transparent;color:var(--muted);cursor:pointer;
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.so-close:hover{background:var(--bg);color:var(--ink)}
.so-close svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round}
.so-body{flex:1;overflow-y:auto;padding:20px;display:flex;flex-direction:column;gap:20px}
.so-section-title{font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);margin-bottom:10px}
/* Kanal özeti · dikkat gerekenler: her satır gideceği sekmeye bağlantı */
.so-dikkat{display:flex;align-items:center;gap:10px;padding:9px 10px;border:1px solid var(--line);border-radius:8px;margin-bottom:6px;color:var(--ink);font-size:13px;text-decoration:none;background:var(--card)}
.so-dikkat:hover{border-color:var(--brand);background:var(--brand-soft)}
.so-dikkat span:nth-child(2){flex:1;min-width:0}
.so-dikkat svg{width:14px;height:14px;stroke:var(--muted);fill:none;stroke-width:1.6;flex:none}
.so-dikkat-nokta{width:8px;height:8px;border-radius:50%;background:var(--muted);flex:none}
.so-dikkat-warning .so-dikkat-nokta{background:var(--warning)}
.so-dikkat-danger .so-dikkat-nokta{background:var(--danger)}
/* Tablo başlığındaki açıklama ipucu (ayrıntı title'da) */
/* Dar ekranda ikincil sütunu gizle, bilgisini ilk hücrenin alt satırına taşı */
.dar-goster{display:none}
@media (max-width:767px){
  .dar-gizle,.mini-table thead th.dar-gizle,.mini-table tbody td.dar-gizle{display:none}
  .dar-goster{display:block}
}
/* Denetim kaydı ayrıntısı (eski → yeni değer) */
.audit-detay{margin-top:6px;font-size:12px}
.audit-detay summary{cursor:pointer;color:var(--brand);font-weight:600}
.audit-detay pre{margin:6px 0 0;padding:8px 10px;background:var(--bg);border:1px solid var(--line);border-radius:6px;white-space:pre-wrap;font:12px/1.5 var(--mono, ui-monospace, monospace);color:var(--ink);max-width:520px}
/* .ro-tag — "salt okunur" etiketi (28 Eyl 2026, yeni bileşen; shell'e eklenmeli).
   Elle düzenlenemeyen, sistemin türettiği değerlerin yanında durur (ICP puanı
   ve sınıfı gibi). Kilit simgesi + kısa metin; tıklanmaz. */
.ro-tag{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:999px;border:1px solid var(--line);background:var(--bg);color:var(--muted);font-size:11px;font-weight:600;line-height:1.5;white-space:nowrap;cursor:default;vertical-align:middle}
.ro-tag svg{width:11px;height:11px;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
/* ICP — rozet, değerlendirme kartı ve üç durumlu kriter seçicisi */
.icp-rozet{display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap}
.icp-rozet .badge{white-space:nowrap}
.icp-ozet{display:grid;grid-template-columns:auto 1fr;gap:6px 16px;align-items:center;padding:4px 0 14px;border-bottom:1px solid var(--line);margin-bottom:6px}
.icp-sinif{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.icp-sinif .badge{font-size:13px;padding:4px 12px}
.icp-puan{justify-self:end;text-align:right}
.icp-puan b{font-size:24px;line-height:1}
.icp-puan span{display:block;font-size:12px;color:var(--muted)}
.icp-aksiyon{grid-column:1/-1;font-weight:600;color:var(--ink)}
.icp-meta{grid-column:1/-1;white-space:normal}
.icp-kriter{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid var(--line)}
.icp-kriter:last-child{border-bottom:0}
.icp-kriter-ad{min-width:0;font-size:13px}
.icp-secim{display:inline-flex;border:1px solid var(--line);border-radius:8px;overflow:hidden;flex:none}
.icp-secim label{position:relative;padding:5px 10px;font-size:12px;font-weight:600;color:var(--muted);cursor:pointer;border-left:1px solid var(--line);user-select:none}
.icp-secim label:first-child{border-left:0}
.icp-secim input{position:absolute;opacity:0;pointer-events:none}
.icp-secim label.is-on{background:var(--brand-soft);color:var(--brand)}
.icp-secim label:has(input[value=evet]).is-on{background:var(--success-soft);color:var(--success)}
.icp-secim label:focus-within{outline:2px solid var(--brand);outline-offset:-2px}
@media (max-width:767px){.icp-kriter{flex-direction:column;align-items:flex-start}.icp-secim{width:100%}.icp-secim label{flex:1;text-align:center}}
/* ICP kuralları — sade ekran */
.icp-baslik{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap}
.icp-cubuk{position:sticky;top:72px;z-index:5;display:flex;gap:16px;align-items:center;justify-content:space-between;flex-wrap:wrap;
  padding:12px 16px;margin-bottom:16px;border:1px solid var(--warning);border-radius:12px;background:var(--warning-soft);box-shadow:var(--shadow)}
.icp-cubuk-metin{min-width:0;flex:1;font-size:13px}
.icp-cubuk-hata{margin-top:6px;color:var(--danger);font-weight:600;font-size:12.5px}
.icp-cubuk-hata span{display:block}
.icp-cubuk-etki{margin-top:6px;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.icp-gecis{display:inline-flex;align-items:center;gap:3px;font-weight:600}
.icp-cubuk-kayit{margin-top:6px;color:var(--warning);font-weight:600;font-size:12.5px}
.icp-cubuk-dugme{display:flex;gap:8px;flex:none}
.icp-siniflar{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:16px}
.icp-sinif-kutu{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:14px;display:flex;flex-direction:column;gap:8px;min-width:0}
.icp-sinif-ust{display:flex;align-items:center;justify-content:space-between;gap:8px}
.icp-sinif-say{font-size:12px;font-weight:600;color:var(--brand);text-decoration:none;white-space:nowrap}
.icp-aralik{font-size:13px;color:var(--muted)}
.icp-aralik b{font-size:20px;color:var(--ink)}
.icp-sinif-aksiyon{font-size:13px;font-weight:600;color:var(--ink)}
.icp-aralik-duzen{display:flex;align-items:center;gap:6px}
.icp-aralik-duzen .input{width:64px}
.icp-aralik-duzen b{font-size:16px}
.icp-kliste{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:24px}
.icp-ksatir-oku{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid var(--line);font-size:13px}
.icp-ksatir-oku.is-pasif{color:var(--muted)}
.icp-ksatir{display:grid;grid-template-columns:minmax(0,1fr) 84px 72px;gap:8px;align-items:center;padding:6px 0;border-bottom:1px solid var(--line)}
.icp-ksatir.is-yeni{grid-template-columns:minmax(0,1fr) 84px 72px}
.icp-ksatir.is-pasif .input[name=k_etiket]{color:var(--muted);text-decoration:line-through}
.icp-puan-giris{display:flex;align-items:center;gap:4px;font-weight:600;color:var(--muted)}
.icp-puan-giris .input{width:64px}
.icp-aktif{display:flex;align-items:center;gap:6px;font-size:12.5px;cursor:pointer;color:var(--muted)}
.icp-kriter-alt{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:10px}
.icp-eksik-giris{display:flex;align-items:center;gap:6px;font-size:12.5px;color:var(--muted)}
.icp-eksik-giris .input{width:64px}
.icp-gecmis{margin-top:14px;font-size:13px}
.icp-gecmis summary{cursor:pointer;color:var(--muted)}
.icp-gecmis-liste{margin-top:8px;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:4px 14px}
.icp-gecmis-satir{display:flex;align-items:center;gap:8px;padding:9px 0;border-bottom:1px solid var(--line);flex-wrap:wrap}
.icp-gecmis-satir:last-child{border-bottom:0}
@media (max-width:991px){.icp-siniflar{grid-template-columns:repeat(2,minmax(0,1fr))}.icp-kliste{grid-template-columns:1fr}}
@media (max-width:767px){.icp-ksatir,.icp-ksatir.is-yeni{grid-template-columns:auto 1fr}.icp-ksatir .input[name=k_etiket]{grid-column:1/-1}.icp-cubuk{top:56px}.icp-cubuk-dugme{width:100%}.icp-cubuk-dugme .btn{flex:1;justify-content:center}}
.th-ipucu{display:inline-block;margin-left:3px;color:var(--muted);font-weight:500;cursor:help}
.so-badges{display:flex;gap:8px;flex-wrap:wrap}
.so-quick{display:flex;gap:8px}
.so-quick .btn{flex:1;justify-content:center}
.so-stats{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.so-stat{border:1px solid var(--line);border-radius:8px;padding:12px}
.so-stat .lbl{font-size:12px;font-weight:500;color:var(--muted)}
.so-stat .val{font-size:18px;font-weight:750;letter-spacing:-.02em;margin-top:2px;line-height:1.2}
.so-stat .hbar{width:100%;margin-top:8px}
.so-foot{display:flex;gap:12px;padding:16px 20px;border-top:1px solid var(--line)}
.so-foot .btn{flex:1;justify-content:center}

/* v0.2 responsive ekleri */
@media (max-width:991px){
  .detail-grid{grid-template-columns:1fr}
  .form-layout{grid-template-columns:1fr}
  .sticky-col{position:static}
}
@media (max-width:767px){
  .form-actions{flex-direction:column-reverse}
  .form-actions .btn{width:100%;justify-content:center}
  .col-menu{display:none}
  /* Dar ekranda mini tablo kendi içinde kayar; kural yalnız .card için
     yazılmıştı, table-card gövdesindeki tablo (SLA hedefleri) sayfanın
     tamamını yana kaydırıyordu. */
  .card .table-scroll,.tc-govde .table-scroll{overflow-x:auto}
  .mini-table{min-width:520px}
  .cust-header .cust-head-actions{margin-left:0;width:100%}
  .cust-head-actions .btn{flex:1 1 auto;justify-content:center}
  .cust-owner{width:100%;min-height:44px;justify-content:center}
  .icon-action{min-width:44px;min-height:44px}
  .data-table tbody tr.row-selected{background:var(--card);border-color:var(--brand)}
  .data-table tbody tr.row-selected td:first-child{box-shadow:none}
  .so-overlay{display:none}
  .slideover{width:100%}
  .so-back{
    display:flex;align-items:center;justify-content:center;
    width:44px;height:44px;margin-left:-8px;border-radius:8px;
    border:none;background:transparent;color:var(--ink);cursor:pointer;flex-shrink:0;
  }
  .so-back svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
  .so-close{display:none}
  .so-foot{flex-direction:column}
  .so-foot .btn{min-height:44px}
}

/* ============================================================
   v0.3 EKLERİ — WORKSPACE VE MÜŞTERİ MODÜLLERİNDE DOĞAN COMPONENTLER
   ============================================================ */


/* Görünüm anahtarlama (prototip içi sayfa geçişi) */
.view{display:none}
.view.is-active{display:block}

/* KPI ikon çipi: success varyantı */
.kpi-icon.k-success{background:var(--success-soft)}
.kpi-icon.k-success svg{stroke:var(--success)}

/* KPI alt satırı — delta yerine nötr kompozisyon bilgisi */
.kpi-sub{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:12px;font-weight:500;color:var(--muted)}
.kpi-sub b{font-weight:650;color:var(--ink);font-variant-numeric:tabular-nums}

/* Tıklanabilir KPI kartı (liste filtresini uygular) */
.kpi-card.is-link{cursor:pointer;transition:border-color .15s,box-shadow .15s}
.kpi-card.is-link:hover{border-color:var(--brand)}
.kpi-card.is-active{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}

/* Seat doluluk hücresi (hbar'ın dar varyantı) */
.hbar i.h-brand{background:var(--brand)}
.seat{display:flex;align-items:center;gap:8px}
.seat b{font-size:13px;font-weight:650;font-variant-numeric:tabular-nums;min-width:38px}
.seat .hbar{width:44px}

/* Geniş liste tablosu + tıklanabilir satır */
.data-table{min-width:1080px}
.data-table.dt-640{min-width:640px}
.data-table tbody tr{cursor:pointer}
/* Daha kompakt satır yüksekliği (masaüstü tablo) */
.data-table tbody td{padding-top:6px;padding-bottom:6px}
.data-table tbody .cust{min-height:0}
.data-table .cust-meta{line-height:1.2}
.data-table .cust-name{font-size:13px}
.data-table .cust .monogram{width:26px;height:26px;font-size:10px}
/* Hücre alt satırı: SARMA YOK — dar kolonda satırı şişirmesin */
.data-table tbody td .cell-sub{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:200px;line-height:1.2}
/* Müşteri hücresi — kompakt: ad (marka, nowrap) + kısa alt bilgi */
.data-table td[data-col="musteri"]{min-width:150px}
.data-table td[data-col="musteri"] .m-ad{display:block;font-weight:600;color:var(--brand);font-size:12.5px;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:190px}
/* Gizli sütun */
.data-table .col-hidden{display:none}

/* Satır sonu aksiyon menüsü */
.row-menu{position:relative;display:inline-block}
.row-menu .dropdown{position:absolute;top:36px;right:0;z-index:45;width:224px;display:none;text-align:left}
.row-menu.open .dropdown{display:block}

/* Sekme paneli anahtarlama */
.tab-panel{display:none;color:var(--ink)}
.tab-panel.is-active{display:block}

/* İstatistik şeridi (so-stat kartlarının çok kolonlu grid'i) */
.stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px}

/* Form sayfası düzeni: ana kolon + sticky özet kolonu */
.form-layout{display:grid;grid-template-columns:1.6fr 1fr;gap:16px;align-items:start}
/* Izgara/esnek çocukların varsayılan min-width'i "auto"dur: içerideki geniş
   bir tablo min-content genişliğini dışarı sızdırıp sütunu ve sayfayı
   şişiriyor (fatura kalem ızgarası 390px ekranda sayfayı 888px yapıyordu).
   Sızıntı burada kesilir, kaydırma kendi kapsayıcısında kalır. */
.form-layout > *{min-width:0}
.field-full{grid-column:1 / -1}

/* Paket seçim kartı */
.pick-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(176px,1fr));gap:12px}

/* Ürün seçimi liste olarak. Kart ızgarası ürün sayısı arttıkça ekranı
   dolduruyordu (9 üründe bir ekran kart) ve kartların yüksekliği içeriğe göre
   kayıyordu. Liste tablo gibi hizalı: aynı bilgi her satırda aynı sütunda,
   başlık bir kez yazılıyor — satırlar göz gezdirilerek karşılaştırılabiliyor. */
.pick-ara{position:relative;display:flex;align-items:center;gap:10px;margin-bottom:10px}
.pick-ara svg{
  position:absolute;left:11px;width:15px;height:15px;pointer-events:none;
  stroke:var(--muted);fill:none;stroke-width:1.6;stroke-linecap:round;
}
.pick-ara .input{padding-left:33px}
.pick-sayi{font-size:12px;font-weight:600;color:var(--muted);white-space:nowrap}
.pick-baslik,.pick-satir{
  display:grid;align-items:center;gap:12px;
  grid-template-columns:16px minmax(140px,1.15fr) 66px minmax(78px,.85fr) minmax(86px,.85fr) minmax(104px,1.1fr);
}
.pick-baslik{
  padding:7px 12px;background:var(--bg);border:1px solid var(--line);border-bottom:none;
  border-radius:10px 10px 0 0;font-size:11px;font-weight:650;color:var(--muted);
  letter-spacing:.04em;text-transform:uppercase;
}
.pick-liste{
  display:flex;flex-direction:column;border:1px solid var(--line);border-radius:0 0 10px 10px;
  overflow:hidden auto;max-height:288px;background:var(--card);
}
.pick-satir{padding:9px 12px;cursor:pointer;border-bottom:1px solid var(--line)}
.pick-satir:last-child{border-bottom:none}
.pick-satir:hover{background:var(--bg)}
.pick-satir input[type=radio]{accent-color:var(--brand);width:15px;height:15px;margin:0}
.pick-satir.is-active{background:var(--brand-soft)}
.pick-satir.is-active .psat-ad{color:var(--brand)}
.psat-ad{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;font-size:13.5px;font-weight:650;min-width:0}
.psat-ad .badge{flex:none}
.psat-h{font-size:12px;font-weight:500;color:var(--muted);min-width:0}
.psat-h b{font-weight:650;color:var(--ink)}
/* Süzgece uymadığı halde listede tutulan seçili satır kendini açıklar. */
.pick-satir.is-tutulu .psat-ad::after{
  content:"seçili";margin-left:2px;padding:1px 7px;border-radius:999px;
  background:var(--brand-soft);color:var(--brand);font-size:11px;font-weight:650;
}
.pick-satir.pk-kapali .psat-ad{color:var(--muted)}
.pick-satir.pk-kapali.is-active .psat-ad{color:var(--brand)}
.pick-bos{padding:14px 2px;font-size:13px;color:var(--muted)}
@media (max-width:860px){
  /* Dar ekranda sütunlar sığmaz; her künye kendi etiketiyle alt alta gelir
     (tablo satırlarının kart görünümüyle aynı kural). */
  .pick-baslik{display:none}
  .pick-liste{border-radius:10px;max-height:none}
  .pick-satir{grid-template-columns:16px 1fr;row-gap:3px;padding:11px 12px}
  .psat-ad,.psat-h{grid-column:2}
  .psat-h{display:flex;gap:6px}
  .psat-h::before{content:attr(data-label) ":";color:var(--muted);font-weight:500}
}
}
.pick-card{
  border:1px solid var(--line);border-radius:12px;padding:16px;
  background:var(--card);cursor:pointer;transition:border-color .15s,background .15s;
}
.pick-card:hover{border-color:var(--brand)}
.pick-card.is-active{border-color:var(--brand);background:var(--brand-soft)}
.pick-name{font-size:13.5px;font-weight:650;display:flex;align-items:center;gap:8px}
.pick-price{font-size:18px;font-weight:750;letter-spacing:-.02em;margin:6px 0 8px;line-height:1.2}
.pick-price span{font-size:12px;font-weight:500;color:var(--muted);letter-spacing:0}
.pick-list{font-size:12px;font-weight:500;color:var(--muted);line-height:1.7}

/* Tutar özeti satırı */
.sum-row{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:8px 0;border-bottom:1px solid var(--line);font-size:13px}
.sum-row .lbl{font-weight:500;color:var(--muted)}
.sum-row .val{font-weight:600;font-variant-numeric:tabular-nums}
.sum-total{border-bottom:none;padding-top:12px;margin-top:4px;border-top:1px solid var(--line)}
.sum-total .lbl{font-size:13.5px;font-weight:600;color:var(--ink)}
.sum-total .val{font-size:18px;font-weight:750;letter-spacing:-.02em}

/* Ödeme kalemi tablosu */
.line-items{width:100%;border-collapse:collapse}
.line-items th{
  background:transparent;font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;
  color:var(--muted);text-align:left;padding:0 8px 10px 0;border-bottom:1px solid var(--line);white-space:nowrap;
}
.line-items td{padding:10px 8px 10px 0;border-bottom:1px solid var(--line);vertical-align:middle}
.line-items tr:last-child td{border-bottom:none}
.line-items tbody tr:hover{background:transparent}
.line-items .input,.line-items .select{height:36px}
.li-del{
  width:36px;height:36px;border-radius:8px;border:1px solid var(--line);background:var(--card);
  color:var(--muted);cursor:pointer;display:flex;align-items:center;justify-content:center;
}
.li-del:hover{border-color:var(--danger);color:var(--danger)}
.li-del svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round}

/* Slide-over ince ayarlar */
.so-quick .btn{padding:0 8px}
/* Hızlı aksiyonlar panele sığmalı: taşma yerine alt satıra iner. */
.so-quick{flex-wrap:wrap;gap:8px}
.so-quick form{display:contents}
.so-quick .btn{white-space:nowrap;flex:0 0 auto}
.so-body{overflow-x:hidden}
.slideover{overflow:hidden}
.info-row .val{min-width:0;overflow-wrap:anywhere}
/* Görünürlük geçişleri "SAYFA & PENCERE GEÇİŞLERİ" bölümünde tanımlı. */

/* Bildirim balonu */
.toast{
  position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:90;
  background:var(--ink);color:#fff;border-radius:8px;padding:12px 16px;
  font-size:12.5px;font-weight:600;box-shadow:var(--shadow);
  display:none;align-items:center;gap:8px;max-width:calc(100% - 32px);
}
.toast.show{display:flex}
.toast-eylem{margin-left:6px;padding:4px 10px;border-radius:6px;border:1px solid rgba(255,255,255,.35);
  background:transparent;color:#fff;font-size:12px;font-weight:650;cursor:pointer;flex-shrink:0}
.toast-eylem:hover{background:rgba(255,255,255,.16)}
.toast svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.toast-ok{background:var(--success)}
.toast-err{background:var(--danger)}
/* Kısmi başarı: işlem oldu ama bir parçası olmadı. */
.toast-uyari{background:var(--warning)}

@media (max-width:991px){
  .form-layout{grid-template-columns:1fr}
}
@media (max-width:767px){
  .data-table{min-width:0}
  /* Satır içi min-width, mobil kart görünümünü sıfırlayan bu kuralı eziyordu
     (auditlog 920px, kullanıcılar 720px, müşteri detayı 960px). Telefonda
     tablo zaten karta dönüşüyor; oradaki min-width HER durumda yanlış, o
     yüzden satır içi stili de geçen tek kural burada. */
  .data-table[style]{min-width:0 !important}
  /* Satır içi min-width mobil kart görünümünü eziyordu; kural sınıfa taşındı
     ve dar ekranda sıfırlanıyor (sistem sağlığı bileşen tablosu 390px'lik
     telefonda sayfayı 656px'e çıkarıyordu). */
  .data-table.dt-640{min-width:0}
  .seat,.health{justify-content:flex-end}
  .seat .hbar,.health .hbar{width:56px}
  tbody td .chips{justify-content:flex-end}
  .filter-spacer{display:none}
  .filter-bar .btn{flex:1 1 auto;justify-content:center}
  .table-foot{padding:0;border-top:none;flex-direction:column;align-items:stretch;gap:12px}
  .table-foot .page-info{margin-right:0;text-align:center}
  .table-foot .pagination{justify-content:center}
  .page-btn{min-width:44px;height:44px}
  .kpi-card.is-active{box-shadow:none}
  .row-menu .dropdown{top:48px}
  .line-items{min-width:520px}
  .toast{bottom:16px}
}

/* Kart başlığı — shell'de markup'ta kullanılıyor ama CSS tanımı eksikti */
.card-head{display:flex;align-items:center;gap:8px;margin-bottom:16px}
.card-title{font-size:15px;font-weight:650;letter-spacing:-.01em}
.card-head .btn{margin-left:auto}
.card-head .badge{margin-left:auto}

/* ---------- İNDİRİM ALANI (yüzde / ₺ seçmeli birleşik input) ---------- */
.disc-input{
  display:flex;align-items:stretch;height:36px;overflow:hidden;
  border:1px solid var(--line);border-radius:8px;background:var(--card);
}
.disc-input input{
  flex:1;min-width:0;border:none;background:transparent;
  padding:0 10px;font-family:inherit;font-size:13px;color:var(--ink);
  text-align:right;font-variant-numeric:tabular-nums;
}
.disc-input input:focus{outline:none}
.disc-input:focus-within{border-color:var(--brand)}
.disc-input.is-limit{border-color:var(--danger)}
.disc-toggle{display:flex;flex-shrink:0;border-left:1px solid var(--line)}
.disc-toggle button{
  width:36px;border:none;background:var(--bg);cursor:pointer;
  font-family:inherit;font-size:12.5px;font-weight:600;color:var(--muted);
}
.disc-toggle button+button{border-left:1px solid var(--line)}
.disc-toggle button.on{background:var(--brand);color:#fff}

/* ---------- YETKİ TAVANI GÖSTERGESİ ---------- */
.limit-meter{margin-top:8px}
.limit-head{display:flex;justify-content:space-between;gap:8px;margin-bottom:5px;font-size:11px;font-weight:500;color:var(--muted)}
.limit-head b{font-weight:650;color:var(--ink);font-variant-numeric:tabular-nums}
.limit-bar{height:6px;border-radius:999px;background:var(--bg);border:1px solid var(--line);overflow:hidden}
.limit-bar i{display:block;height:100%;border-radius:999px;background:var(--success);transition:width .15s}
.limit-bar i.l-warning{background:var(--warning)}
.limit-bar i.l-danger{background:var(--danger)}
.limit-note{margin-top:5px;font-size:11px;font-weight:500;color:var(--muted);line-height:1.45}
.limit-note.is-limit{color:var(--danger)}

/* Özet satırı — indirim varyantı */
.sum-row.is-discount .val{color:var(--success)}

@media (max-width:767px){
  .disc-input{height:44px}
  .disc-toggle button{width:44px}
}

/* ---------- MÜŞTERİ ↔ WORKSPACE İLİŞKİSİ ---------- */
.multi-tag{color:var(--brand);font-weight:600}
.ws-mini{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:10px 12px;margin-bottom:8px;
  border:1px solid var(--line);border-radius:8px;
  font-size:13px;cursor:pointer;background:var(--card);
}
.ws-mini:last-of-type{margin-bottom:0}
.ws-mini:hover{border-color:var(--brand);background:var(--brand-soft)}

/* Slide-over gate: eksik zorunlu alan vurgusu */
.hi-need > label{color:var(--warning);font-weight:700}
.hi-need .input,.hi-need .select{border-color:var(--warning);box-shadow:0 0 0 3px var(--warning-soft)}

/* Aşama Kaydı — dikey zaman çizelgesi + satır içi düzenleme (referans) */
.card-note{margin-left:auto;font-size:12px;font-weight:500;color:var(--muted);text-align:right}
.stage-log{display:flex;flex-direction:column}
.slog{display:flex;gap:12px;padding-bottom:18px}
.slog:last-child{padding-bottom:0}
.slog-rail{position:relative;flex-shrink:0;width:14px;display:flex;justify-content:center}
.slog-rail::before{content:'';position:absolute;top:18px;bottom:-18px;left:50%;width:1px;background:var(--line)}
.slog:last-child .slog-rail::before{display:none}
.slog-dot{width:12px;height:12px;border-radius:50%;border:2px solid var(--line);background:var(--card);margin-top:3px;position:relative;z-index:1}
.slog.is-done .slog-dot{background:var(--brand);border-color:var(--brand)}
.slog.is-current .slog-dot{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.slog.is-won .slog-dot{background:var(--success);border-color:var(--success)}
.slog.is-lost .slog-dot{background:var(--danger);border-color:var(--danger)}
.slog-body{flex:1;min-width:0}
.slog-head{display:flex;align-items:baseline;gap:12px}
.slog-name{font-size:13.5px;font-weight:650;letter-spacing:-.01em}
.slog.is-todo .slog-name{color:var(--muted);font-weight:500}
.slog.is-current .slog-name{color:var(--brand)}
.slog-meta{margin-left:auto;font-size:12px;font-weight:600;color:var(--accent);white-space:nowrap}
.slog-fields{margin-top:8px;display:flex;flex-direction:column;gap:8px}
.slog-field{display:flex;align-items:flex-start;gap:8px;font-size:13px;min-height:24px}
.slog-field .lbl{flex:0 0 128px;font-size:12px;font-weight:500;color:var(--muted);padding-top:2px}
.slog-field .val{flex:1;min-width:0;font-weight:500;line-height:1.5;word-break:break-word;padding-top:1px}
.slog-field .val.empty{color:var(--muted)}
.slog-edit{width:24px;height:24px;flex-shrink:0;border:none;background:transparent;border-radius:6px;color:var(--muted);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;opacity:0;transition:opacity .12s}
.slog-field:hover .slog-edit,.slog-edit:focus{opacity:1}
.slog-edit:hover{background:var(--bg);color:var(--brand)}
.slog-edit svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.slog-editing{flex:1;display:flex;gap:8px;flex-wrap:wrap;align-items:flex-start}
.slog-editing .input{flex:1 1 200px;height:34px}
.slog-editing .textarea{flex:1 1 100%;min-height:60px;height:auto;padding:8px 12px}
.slog-editing .btn{height:34px}
@media (max-width:767px){
  .card-note{display:none}
  .slog-field{flex-wrap:wrap;gap:2px 8px}
  .slog-field .lbl{flex:1 1 100%}
  .slog-edit{opacity:1;width:32px;height:32px}
  .slog-editing .btn{flex:1 1 auto;justify-content:center}
}

/* Aşama Kaydı — aksiyon footer (İlerlet + Kazanıldı + Kaybedildi) */
.slog-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px;padding-top:16px;border-top:1px solid var(--line)}
.slog-actions .stage-go{width:100%;justify-content:center;margin-top:0}
.slog-gate-note{flex:1 1 100%;display:flex;gap:8px;align-items:flex-start;font-size:12.5px;color:var(--warning);background:var(--warning-soft);border-radius:8px;padding:8px 10px}
.slog-gate-note svg{width:15px;height:15px;flex-shrink:0;margin-top:1px;stroke:var(--warning);fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.slog-gate-note b{color:var(--ink)}

/* Pipeline slide-over — kompakt stepper (panele sığar, taşmaz) */
.sf-steps{display:flex;align-items:flex-start;margin-bottom:14px}
.sf-steps .step{flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;gap:6px;position:relative}
.sf-steps .step::before{content:"";position:absolute;top:11px;left:-50%;width:100%;height:2px;background:var(--line);z-index:0}
.sf-steps .step:first-child::before{display:none}
.sf-steps .step.done::before,.sf-steps .step.current::before{background:var(--success)}
.sf-steps .step-dot{width:24px;height:24px;border-radius:50%;border:2px solid var(--line);background:var(--card);display:flex;align-items:center;justify-content:center;z-index:1;position:relative}
.sf-steps .step.done .step-dot{background:var(--success);border-color:var(--success)}
.sf-steps .step.current .step-dot{background:var(--brand);border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}
.sf-steps .step-dot svg{width:13px;height:13px;stroke:#fff;fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.sf-steps .step-label{font-size:9.5px;line-height:1.2;font-weight:600;color:var(--muted);text-align:center;letter-spacing:-.02em;padding:0 2px}
.sf-steps .step.done .step-label{color:var(--ink)}
.sf-steps .step.current .step-label{color:var(--brand);font-weight:750}

/* Pipeline slide-over — aşama ilerlet kartı */
.stage-box{border:1px solid var(--line);border-left:3px solid var(--brand);border-radius:12px;padding:14px;background:var(--card)}
.stage-box.is-ready{border-left-color:var(--success);background:linear-gradient(180deg,var(--success-soft),var(--card) 70%)}
.stage-box.is-gated{border-left-color:var(--warning);background:linear-gradient(180deg,var(--warning-soft),var(--card) 60%)}
.stage-box.is-closed,.stage-box.is-final{border-left-color:var(--muted)}
.stage-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.stage-now{font-weight:700;font-size:12.5px;color:var(--ink);background:var(--bg);border:1px solid var(--line);padding:3px 10px;border-radius:20px}
.stage-arrow{width:24px;height:18px;stroke:var(--muted);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.stage-next{font-weight:750;font-size:14px;color:var(--brand);letter-spacing:-.01em}
.stage-ok{margin-left:auto;font-size:12px;font-weight:700;color:var(--success)}
.stage-need-badge{margin-left:auto;font-size:11px;font-weight:700;color:var(--warning);background:var(--warning-soft);padding:2px 9px;border-radius:20px}
.stage-req{margin-top:12px;padding-top:12px;border-top:1px dashed var(--line)}
.stage-req-note{font-size:12.5px;color:var(--muted);margin-bottom:8px}
.stage-req-note b{color:var(--ink)}
.stage-need > label{color:var(--warning);font-weight:700}
.stage-go{width:100%;justify-content:center;margin-top:12px;gap:8px}
.stage-go svg{width:18px;height:14px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.stage-go:disabled{opacity:.6;pointer-events:none}
.stage-done{display:flex;align-items:center;gap:10px;color:var(--success);font-size:13px;font-weight:600}
.stage-done svg{width:22px;height:22px;stroke:var(--success);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.ws-mini.is-current{border-color:var(--brand);background:var(--brand-soft)}
.ws-mini b{font-weight:600}
.ws-mini .cell-sub{margin-top:1px}

/* Slide-over alt çubuğu — iki satır */
.so-foot-stack{flex-direction:column;gap:8px}
.so-foot-stack .btn{width:100%;justify-content:center}
.so-foot-row{display:flex;gap:8px;width:100%}
.so-foot-row .btn{flex:1}

/* Salt okunur form alanı */
.input[readonly]{background:var(--bg);color:var(--muted)}

/* ---------- TOOLBAR (arama + tablo aksiyonları + birincil aksiyon) ---------- */
.toolbar{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.toolbar-search{flex:1 1 auto;max-width:420px}
.toolbar .btn-group{margin-left:auto}
/* Aksiyon kümesi (Dışa aktar/Yenile/Sütunlar) + Yeni butonu sağda kalsın —
   btn-group pop-wrap içine alındığı için itme pop-wrap'e taşındı. */
.toolbar > .pop-wrap{margin-left:auto}

/* İkon buton grubu — düşük frekanslı tablo aksiyonları */
.btn-group{display:inline-flex;background:var(--card);border:1px solid var(--line);border-radius:8px;overflow:hidden;flex-shrink:0}
.btn-icon{
  width:36px;height:36px;flex-shrink:0;
  border:none;background:transparent;cursor:pointer;color:var(--muted);
  display:flex;align-items:center;justify-content:center;
}
.btn-icon+.btn-icon{border-left:1px solid var(--line)}
.btn-icon:hover{background:var(--bg);color:var(--ink)}
.btn-icon svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}

/* Filtre satırı */
.filter-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:16px}
/* Çoklu seçim paneli (data-coklu) süzgeç satırından taşar. Sayfa giriş
   animasyonu her bloğu ayrı yığın bağlamı yaptığı için sonraki tablo kartı
   panelin ÜSTÜNE çiziliyordu: panel açılıyor ama görünmüyordu. */
.filter-row:has(details[data-coklu]){position:relative;z-index:30}
.link-clear{
  display:none;margin-left:auto;padding:0 4px;height:36px;
  border:none;background:transparent;cursor:pointer;
  font-family:inherit;font-size:12.5px;font-weight:600;color:var(--brand);
}
.link-clear.is-on{display:inline-flex;align-items:center}
.link-clear:hover{text-decoration:underline}

/* ---------- 360: MÜŞTERİ BAĞLAM ŞERİDİ + WORKSPACE SEÇİCİ ---------- */
.ctx-bar{
  background:var(--card);border:1px solid var(--line);border-radius:12px;
  box-shadow:var(--shadow);padding:16px 20px;margin-bottom:16px;
}
.ctx-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.ctx-meta-wrap{min-width:0}
.ctx-name{font-size:15px;font-weight:650;letter-spacing:-.01em;line-height:1.25}
.ctx-meta{font-size:12px;font-weight:500;color:var(--muted);margin-top:1px}
.ctx-stats{display:flex;gap:24px;margin-left:auto;flex-wrap:wrap}
.ctx-stat{line-height:1.25}
.ctx-stat .lbl{display:block;font-size:11px;font-weight:500;color:var(--muted)}
.ctx-stat .val{font-size:15px;font-weight:700;letter-spacing:-.01em;font-variant-numeric:tabular-nums}

.ws-switch{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px;padding-top:16px;border-top:1px solid var(--line)}
.ws-tab{
  display:flex;flex-direction:column;align-items:flex-start;gap:2px;
  min-width:168px;padding:9px 14px;
  border:1px solid var(--line);border-radius:8px;background:var(--card);
  font-family:inherit;text-align:left;cursor:pointer;
}
.ws-tab:hover{border-color:var(--brand)}
.ws-tab.is-active{border-color:var(--brand);background:var(--brand-soft);box-shadow:inset 0 0 0 1px var(--brand)}
.ws-tab-name{display:flex;align-items:center;gap:7px;font-size:13.5px;font-weight:650;color:var(--ink)}
.ws-tab-name i{width:7px;height:7px;border-radius:50%;flex-shrink:0}
.ws-tab-sub{font-size:12px;font-weight:500;color:var(--muted);font-variant-numeric:tabular-nums}
.ws-add{
  display:flex;align-items:center;gap:6px;
  padding:9px 14px;border:1px dashed var(--line);border-radius:8px;background:transparent;
  font-family:inherit;font-size:12.5px;font-weight:600;color:var(--brand);cursor:pointer;
}
.ws-add:hover{border-color:var(--brand);background:var(--brand-soft)}
.ws-add svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}

@media (max-width:1199px){
  .toolbar-search{max-width:none}
  .ctx-stats{gap:16px}
}
@media (max-width:767px){
  .toolbar{flex-wrap:wrap}
  .toolbar-search{flex:1 1 100%;max-width:none}
  .toolbar-search input{height:44px}
  .toolbar .btn-group{margin-left:0}
  .toolbar > .pop-wrap{margin-left:0}
  .btn-icon{width:44px;height:44px}
  .toolbar .btn-primary{flex:1}
  .filter-row .filter-select{display:none}
  .filter-row .filters-btn{flex:1 1 auto;justify-content:center}
  .link-clear{margin-left:0;height:44px}
  .ctx-bar{padding:16px}
  .ctx-head .btn{width:100%;justify-content:center;margin-top:4px}
  .ctx-stats{margin-left:0;width:100%;justify-content:space-between;gap:12px}
  .ws-tab{flex:1 1 100%;min-width:0;min-height:44px}
  .ws-add{width:100%;justify-content:center;min-height:44px}
}


/* Workspace durum özeti — nokta dizisi (her nokta bir workspace) */
.ws-pips{display:flex;align-items:center;gap:10px;cursor:default}
.ws-pips .n{font-size:15px;font-weight:700;font-variant-numeric:tabular-nums;min-width:14px}
.pips{display:flex;align-items:center;gap:4px}
.pips i{width:9px;height:9px;border-radius:50%;flex-shrink:0}
.pips .more{font-size:11px;font-weight:600;color:var(--muted);margin-left:2px}
.pips-text{display:none;font-size:12px;font-weight:500;color:var(--muted)}
.st-none{font-size:12px;font-weight:500;color:var(--muted);font-style:normal}

/* İpucu balonu — dokunmatikte hover olmadığı için mobilde metne düşer */
.tip{
  position:fixed;z-index:95;display:none;pointer-events:none;
  background:var(--navy);color:#fff;
  padding:7px 10px;border-radius:8px;
  font-size:12px;font-weight:500;line-height:1.4;white-space:nowrap;
  box-shadow:0 4px 14px rgba(15,49,86,.25);
}
.tip.show{display:block}
.tip.tip-genis{white-space:normal;max-width:320px;font-weight:400;line-height:1.5;padding:9px 12px}
.tip::after{content:"";position:absolute;left:50%;bottom:-4px;width:8px;height:8px;background:var(--navy);transform:translateX(-50%) rotate(45deg)}
.tip.alt::after{bottom:auto;top:-4px}

/* Bilgi ikonu — kalıcı açıklama metni yerine, istendiğinde gösterilen ipucu.
   Ekranda sürekli duran uzun açıklama, asıl veriyi geri plana itiyordu. */
.ipucu-btn{width:17px;height:17px;padding:0;border:0;border-radius:50%;background:none;
  color:var(--muted);cursor:help;display:inline-flex;align-items:center;justify-content:center;
  vertical-align:middle;flex-shrink:0;transition:color .15s}
.ipucu-btn:hover,.ipucu-btn:focus-visible{color:var(--brand);outline:none}
.ipucu-btn svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.6;
  stroke-linecap:round;stroke-linejoin:round}

/* Kolon menüsü — ikon butona bağlı açılır liste */
.pop-wrap{position:relative}
.pop-wrap .dropdown{position:absolute;top:42px;right:0;z-index:45;width:236px;display:none;max-height:340px;overflow-y:auto}
.pop-wrap.open .dropdown{display:block}
.dd-check{display:flex;align-items:center;gap:8px;padding:7px 10px;border-radius:6px;font-size:13px;font-weight:500;cursor:pointer}
.dd-check:hover{background:var(--brand-soft)}
.dd-check input{width:16px;height:16px;accent-color:var(--brand);cursor:pointer;flex-shrink:0}

/* Kolon gizleme */
.col-off{display:none !important}

/* MRR alt bilgisi */
.val-sub{display:block;font-size:11px;font-weight:500;color:var(--muted);margin-top:1px}

/* Etiketler */
.tags{display:flex;gap:4px;flex-wrap:wrap}

/* Mükerrer kayıt uyarısı — aksiyonlu */
.alert-action{margin-left:auto;flex-shrink:0;align-self:center}
@media (max-width:767px){
  .pips-text{display:inline}
  .tip{display:none !important}
  /* .alert bir satır flex'i; sarma açılmadan aksiyona verilen width:100%
     metni ezip düğmeyi ekranın dışına taşırıyordu ("217 lead / aranmayı /
     bekliyor" üç satıra kırılıp düğme sağdan kesiliyordu). */
  .alert{flex-wrap:wrap}
  .alert > div{flex:1 1 auto;min-width:0}
  .alert-action{margin-left:0;flex:1 1 100%;width:100%;margin-top:8px}
  .alert-action .btn{width:100%;justify-content:center}
  .pop-wrap .dropdown{width:260px}
}

/* Şifre alanı + göster düğmesi */
.sifre-alan{display:flex;gap:8px;align-items:center}
.sifre-alan .input{flex:1;min-width:0}

/* Teknik değer (ürün anahtarı, kod) — göz karıştırmasın diye tek aralıklı. */
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;word-break:break-all}

/* Sistem sağlığı · ölçülen ile elle bildirilen bileşen ayracı */
.bilesen-ayrac td{background:var(--bg);font-size:12px;color:var(--muted);padding:8px 12px !important}
.bilesen-ayrac td b{color:var(--ink)}
.bilesen-elle td:first-child{color:var(--ink2)}

/* Telefon hücresi: numara boşluklarından kırılmasın */
.td-tel{white-space:nowrap}

/* Sıralanabilir tablo başlığı */
th.sortable{cursor:pointer;user-select:none}
th.sortable:hover{color:var(--ink)}
th .sort-ar{display:inline-block;margin-left:4px;opacity:0;font-size:10px}
th.sorted .sort-ar{opacity:1}

/* Workspace kırılımlı grup başlığı (lisans / onboarding sekmeleri) */
.grp-head{
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  padding:10px 12px;margin-bottom:12px;
  background:var(--bg);border:1px solid var(--line);border-radius:8px;
}
.grp-head b{font-size:13.5px;font-weight:650}
.grp-head .cell-sub{display:inline;margin-left:0}
.grp-head .badge{margin-left:auto}
.grp{margin-bottom:20px}
.grp:last-child{margin-bottom:0}

/* ---------- SAĞLIK SKORU KIRILIM POPOVER'I ---------- */
/* Listede skora tıklanınca açılır, Müşteri 360°'ta kart olarak durur. */
.health-btn{
  display:flex;align-items:center;gap:8px;
  border:none;background:transparent;padding:0;margin:0;
  font-family:inherit;cursor:pointer;
}
.health-btn b{
  font-size:13px;font-weight:650;font-variant-numeric:tabular-nums;min-width:22px;
  color:var(--ink);border-bottom:1px dashed var(--muted);line-height:1.4;
}
.health-btn .hbar{display:block;width:56px;height:6px;border-radius:999px;background:var(--bg);border:1px solid var(--line);overflow:hidden;flex-shrink:0}
.health-btn:hover b{color:var(--brand);border-bottom-color:var(--brand)}
.health-btn:hover .hbar{border-color:var(--brand)}

.score-pop{
  position:fixed;z-index:92;display:none;width:300px;
  background:var(--card);border:1px solid var(--line);border-radius:12px;
  box-shadow:var(--shadow);padding:16px;
}
.score-pop.open{display:block}
.sp-head{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin-bottom:10px}
.sp-title{font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}
.sp-total{font-size:22px;font-weight:750;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.sp-total span{font-size:12px;font-weight:500;color:var(--muted)}
.sp-row{display:flex;align-items:center;gap:10px;padding:6px 0}
.sp-lbl{flex:1;min-width:0;font-size:12.5px;font-weight:500}
.sp-lbl span{color:var(--muted)}
.sp-row .hbar{width:64px;flex-shrink:0}
.sp-val{width:24px;text-align:right;font-size:12.5px;font-weight:650;font-variant-numeric:tabular-nums}
.sp-foot{
  margin-top:12px;padding-top:12px;border-top:1px solid var(--line);
  font-size:11.5px;font-weight:500;color:var(--muted);line-height:1.55;
}
.sp-foot .badge{margin-right:6px;font-size:11px;padding:1px 8px}
.sp-formula{display:block;margin-top:6px;color:var(--muted)}

/* ---------- KOLON GENİŞLİĞİ AYARI ---------- */
.data-table thead th{position:relative}
.col-grip{
  position:absolute;top:0;right:0;width:11px;height:100%;
  cursor:col-resize;display:flex;align-items:center;justify-content:center;
}
.col-grip::after{content:"";width:1px;height:14px;background:var(--line)}
.col-grip:hover::after,.col-grip.dragging::after{width:2px;height:100%;background:var(--brand)}
table.resizing{user-select:none;cursor:col-resize}
.btn-icon{position:relative}
.btn-icon .pin{
  position:absolute;top:6px;right:6px;width:6px;height:6px;border-radius:50%;
  background:var(--brand);border:1.5px solid var(--card);display:none;
}
.btn-icon.has-custom .pin{display:block}
.dd-foot{border-top:1px solid var(--line);margin-top:4px;padding-top:4px}

@media (max-width:767px){
  .score-pop{
    left:0 !important;right:0;top:auto !important;bottom:0;
    width:100%;border-radius:16px 16px 0 0;padding:20px 16px 24px;
  }
  .health-btn{min-height:44px}
  .col-grip{display:none}
}

/* Kolon menüsü ekleri */
.dd-check.is-locked{opacity:.5;cursor:not-allowed}
.dd-count{padding:4px 10px 6px;font-size:11px;font-weight:500;color:var(--muted)}

/* Risk altındaki gelir */
.val-sub.is-risk{color:var(--danger);font-weight:600}
.so-stat .risk{display:block;margin-top:3px;font-size:11px;font-weight:600;color:var(--danger)}
.progress i.p-danger{background:var(--danger)}

/* Bağlam şeridinde risk göstergesi */
.ctx-risk{display:block;font-size:11px;font-weight:600;color:var(--danger);margin-top:1px}
/* Shell içinde statik gösterim için */
.section .toast{box-shadow:none}
.section .dropdown{position:static;display:block}


/* ============================================================
   v0.4 — SATIŞ PIPELINE MODÜLÜNDE DOĞAN COMPONENTLER
   ============================================================ */

/* --- Pane: bir ekran içindeki görünüm değişimi (kanban ↔ liste) --- */
.pane{display:none}
.pane.is-on{display:block}

/* --- Görünüm anahtarı (segmented control) --- */
.seg{display:inline-flex;background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:2px;flex-shrink:0}
.seg-btn{
  height:30px;padding:0 12px;border:none;border-radius:6px;background:transparent;
  font-family:inherit;font-size:12.5px;font-weight:600;color:var(--muted);cursor:pointer;
  display:inline-flex;align-items:center;gap:6px;white-space:nowrap;
}
.seg-btn svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.seg-btn:hover{color:var(--ink)}
.seg-btn.is-active{background:var(--card);color:var(--ink);box-shadow:0 1px 2px rgba(15,49,86,.10)}

/* --- Filtre çipi (aç/kapa filtreler) --- */
.chip-filter{
  height:36px;padding:0 12px;border:1px solid var(--line);border-radius:8px;background:var(--card);
  font-family:inherit;font-size:12.5px;font-weight:600;color:var(--muted);cursor:pointer;
  display:inline-flex;align-items:center;gap:6px;white-space:nowrap;
}
.chip-filter svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.chip-filter b{font-weight:700;font-variant-numeric:tabular-nums}
.chip-filter:hover{border-color:var(--brand);color:var(--brand)}
.chip-filter.is-on{border-color:var(--brand);background:var(--brand-soft);color:var(--brand)}
.chip-filter.is-warning.is-on{border-color:var(--warning);background:var(--warning-soft);color:var(--warning)}

/* --- Kanban tahtası --- */
.board{display:flex;gap:12px;align-items:flex-start;overflow-x:auto;padding-bottom:8px}
.col{
  flex:1 1 216px;min-width:216px;max-width:320px;
  background:var(--card);border:1px solid var(--line);border-radius:12px;
  box-shadow:var(--shadow);display:flex;flex-direction:column;
}
.col-head{padding:14px;border-bottom:1px solid var(--line);border-radius:12px 12px 0 0;background:#F8FAFD}
.col-name{display:flex;align-items:center;gap:8px;font-size:13.5px;font-weight:650;letter-spacing:-.01em}
.col-name i{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.col-name .cnt{
  margin-left:auto;background:var(--card);border:1px solid var(--line);color:var(--muted);
  font-size:11px;font-weight:650;min-width:20px;height:20px;border-radius:999px;
  display:inline-flex;align-items:center;justify-content:center;padding:0 6px;font-variant-numeric:tabular-nums;
}
.col-sum{display:flex;align-items:baseline;gap:5px;margin-top:8px;font-size:12px;font-weight:500;color:var(--muted)}
.col-sum b{font-size:15px;font-weight:700;letter-spacing:-.01em;color:var(--ink);font-variant-numeric:tabular-nums}
.col-body{padding:12px;display:flex;flex-direction:column;gap:10px;min-height:104px;border-radius:0 0 12px 12px}
.col-body.is-over{background:var(--brand-soft)}
.col-empty{
  border:1px dashed var(--line);border-radius:8px;padding:14px 12px;text-align:center;
  font-size:12px;font-weight:500;color:var(--muted);
}
.col.is-won .col-head{background:var(--success-soft)}
.col.is-lost .col-head{background:var(--danger-soft)}

/* --- Fırsat kartı --- */
.kcard{
  border:1px solid var(--line);border-radius:12px;background:var(--card);
  padding:12px;cursor:pointer;transition:border-color .15s,box-shadow .15s;
}
.kcard:hover{border-color:var(--brand);box-shadow:0 1px 2px rgba(15,49,86,.04), 0 6px 16px rgba(15,49,86,.06)}
.kcard.is-drag{opacity:.45}
.kcard-top{display:flex;align-items:flex-start;gap:8px}
.kcard-name{font-size:13px;font-weight:650;line-height:1.35;min-width:0}
.kcard .row-action{width:26px;height:26px;font-size:15px;margin:-4px -4px 0 auto;flex-shrink:0}
.kcard-amt{display:flex;align-items:baseline;gap:5px;margin-top:6px}
.kcard-amt b{font-size:16px;font-weight:750;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.kcard-amt span{font-size:11.5px;font-weight:500;color:var(--muted)}
.kcard-chips{display:flex;flex-wrap:wrap;gap:4px;margin-top:8px}
.kcard-flags{margin-top:8px}
.kcard-foot{
  display:flex;align-items:center;gap:8px;margin-top:10px;padding-top:10px;
  border-top:1px solid var(--line);font-size:11.5px;font-weight:500;color:var(--muted);
}
.kcard-foot .monogram{margin-left:auto}
.kcard-date{display:inline-flex;align-items:center;gap:5px;white-space:nowrap}
.kcard-date svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.kcard-date em{font-style:normal;font-weight:600}
.kcard-date.is-late{color:var(--danger);font-weight:600}

/* --- Mini durum rozeti --- */
.flag{
  display:inline-flex;align-items:center;gap:4px;
  padding:2px 8px;border-radius:999px;
  font-size:11px;font-weight:600;white-space:nowrap;
}
.flag svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.flag-warning{background:var(--warning-soft);color:var(--warning)}
.flag-danger{background:var(--danger-soft);color:var(--danger)}
.flag-accent{background:var(--accent-soft);color:var(--accent)}
.flag-neutral{background:var(--bg);color:var(--muted)}

/* --- Aşama hücresi (tablo) --- */
.stage-cell{display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:600;white-space:nowrap}
.stage-cell i{width:8px;height:8px;border-radius:50%;flex-shrink:0}

/* --- Aşama kilidi: eksik alan listesi --- */
.gate-list{display:flex;flex-direction:column;gap:12px;margin-bottom:20px}
.gate-item{border:1px solid var(--line);border-radius:8px;padding:12px}
.gate-item label{display:flex;align-items:baseline;gap:4px;font-size:12px;font-weight:500;color:var(--muted);margin-bottom:6px}
.gate-item label b{color:var(--danger);font-weight:600}
.gate-stage{margin-left:auto;font-size:11px;font-weight:600;color:var(--muted)}

/* --- Stepper: kaybedildi varyantı --- */
.step.lost .step-dot{background:var(--danger);border-color:var(--danger);color:#fff}
.step.lost .step-label{color:var(--danger)}
.step.lost .step-dot svg{stroke:#fff}

/* --- Canlı modal sarmalayıcı: .modal-wrap + .open --- */
.modal-wrap{position:fixed;inset:0;z-index:80;display:flex;align-items:center;justify-content:center;padding:24px 16px;background:rgba(15,49,86,.45)}
.modal-wrap .modal{max-height:calc(100vh - 48px);overflow-y:auto;box-shadow:var(--shadow)}
.modal-wrap .modal.is-wide{max-width:460px}
.modal-field{margin-bottom:16px}
.modal-field:last-of-type{margin-bottom:20px}
.modal-field label{display:block;font-size:12px;font-weight:500;color:var(--muted);margin-bottom:6px}
.modal-field label b{color:var(--danger);font-weight:600}
/* Etiketin yanına bilgi ikonu koymak için: label display:block olduğundan
   ikon kendi satırına düşüyordu. Modal alanlarında da, normal form
   alanlarında (.field) da geçerli — kural modale bağlıyken paket formundaki
   ipucu ikonları etiketin altına düşüyordu. */
.mf-baslik{display:flex;align-items:center;gap:5px;margin-bottom:6px}
.mf-baslik label{margin-bottom:0}
.radio-stack{display:flex;flex-direction:column;gap:8px}
.radio-card{
  display:flex;align-items:flex-start;gap:10px;padding:12px;
  border:1px solid var(--line);border-radius:8px;cursor:pointer;font-size:13px;font-weight:500;
}
.radio-card:hover{border-color:var(--brand)}
.radio-card.is-active{border-color:var(--brand);background:var(--brand-soft)}
.radio-card input{width:16px;height:16px;accent-color:var(--brand);margin-top:1px;flex-shrink:0;cursor:pointer}
.radio-card b{display:block;font-weight:650;margin-bottom:1px}
.radio-card span{font-size:12px;font-weight:500;color:var(--muted);line-height:1.45}

/* --- Fırsat detayı ekleri --- */
.cust-head-sub{font-variant-numeric:tabular-nums}
.ws-mini.is-link{cursor:pointer}
.ws-mini b{display:block}
.stat-grid .so-stat .val{font-size:18px;font-weight:750;letter-spacing:-.02em;margin-top:2px;line-height:1.2}

/* ---------- RESPONSIVE ---------- */
@media (max-width:1199px){
  .col{flex:0 0 232px;min-width:232px}
}
@media (max-width:767px){
  .board{gap:10px;scroll-snap-type:x mandatory;margin:0 -16px;padding:0 16px 8px}
  .col{flex:0 0 84vw;min-width:84vw;max-width:none;scroll-snap-align:start}
  .seg{width:100%}
  .seg-btn{flex:1;justify-content:center;height:40px}
  .toolbar .seg{order:-1}
  .kcard{padding:14px}
  .kcard .row-action{width:32px;height:32px}
  .chip-filter{height:44px;flex:1 1 auto;justify-content:center}
  .filter-row.is-open .filter-select{display:block;flex:1 1 100%;height:44px}
  .modal-wrap{padding:0;align-items:flex-end}
  .modal-wrap .modal{max-width:none;width:100%;border-radius:16px 16px 0 0;max-height:88vh}
  .modal-actions{flex-direction:column-reverse}
  .modal-actions .btn{width:100%;justify-content:center}
  .line-items{min-width:560px}
}

/* --- Aşama Kaydı (geçmiş + satır içi düzenleme) --- */
.card-note{margin-left:auto;font-size:12px;font-weight:500;color:var(--muted);text-align:right}
.stage-log{display:flex;flex-direction:column}
.slog{display:flex;gap:12px;padding-bottom:18px}
.slog:last-child{padding-bottom:0}
.slog-rail{position:relative;flex-shrink:0;width:14px;display:flex;justify-content:center}
.slog-rail::before{content:'';position:absolute;top:18px;bottom:-18px;left:50%;width:1px;background:var(--line)}
.slog:last-child .slog-rail::before{display:none}
.slog-dot{width:12px;height:12px;border-radius:50%;border:2px solid var(--line);background:var(--card);margin-top:3px;position:relative;z-index:1}
.slog.is-done .slog-dot{background:var(--brand);border-color:var(--brand)}
.slog.is-current .slog-dot{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.slog.is-won .slog-dot{background:var(--success);border-color:var(--success)}
.slog.is-lost .slog-dot{background:var(--danger);border-color:var(--danger)}
.slog-body{flex:1;min-width:0}
.slog-head{display:flex;align-items:baseline;gap:12px}
.slog-name{font-size:13.5px;font-weight:650;letter-spacing:-.01em}
.slog.is-todo .slog-name{color:var(--muted);font-weight:500}
.slog.is-current .slog-name{color:var(--brand)}
.slog-meta{margin-left:auto;font-size:12px;font-weight:500;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap;text-align:right}
.slog-fields{margin-top:8px;display:flex;flex-direction:column;gap:8px}
.slog-field{display:flex;align-items:flex-start;gap:8px;font-size:13px;min-height:24px}
.slog-field .lbl{flex:0 0 128px;font-size:12px;font-weight:500;color:var(--muted);padding-top:2px}
.slog-field .val{flex:1;min-width:0;font-weight:500;line-height:1.5;word-break:break-word}
.slog-field .val.empty{color:var(--muted)}
.slog-edit{width:24px;height:24px;flex-shrink:0;border:none;background:transparent;border-radius:6px;color:var(--muted);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;opacity:0;transition:opacity .12s}
.slog-field:hover .slog-edit,.slog-edit:focus{opacity:1}
.slog-edit:hover{background:var(--bg);color:var(--brand)}
.slog-edit svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.slog-editing{flex:1;display:flex;gap:8px;flex-wrap:wrap;align-items:flex-start}
.slog-editing .input,.slog-editing .select{flex:1 1 200px;height:34px}
.slog-editing .textarea{flex:1 1 100%;min-height:64px}
.slog-editing .btn{height:34px;padding:0 12px}

@media (max-width:767px){
  .card-note{display:none}
  .slog-meta{font-size:11.5px}
  .slog-field{flex-wrap:wrap;gap:2px 8px}
  .slog-field .lbl{flex:1 1 100%}
  .slog-edit{opacity:1;width:32px;height:32px}
  .slog-editing .btn{flex:1 1 auto;justify-content:center}
}

/* --- Ürün satırı: satır içi düzenleme --- */
.mini-table .li-act{width:32px;text-align:right;padding-left:0}
.mini-table tr:hover .slog-edit{opacity:1}
.line-edit{display:flex;flex-wrap:wrap;gap:8px;padding:4px 0}
.line-edit .select{flex:1 1 150px;min-width:130px}
.line-edit .input{flex:1 1 90px;min-width:80px}
.line-edit-actions{display:flex;gap:8px;flex:1 1 100%}
.line-edit-actions .btn{flex:1 1 auto;justify-content:center}

/* --- Aktivite geçmişi: değişiklik detayı --- */
.tl-diff{display:block;margin-top:2px;font-size:12px;font-weight:500;color:var(--muted);word-break:break-word}
.tl-who{display:block;margin-top:2px;font-size:11.5px;font-weight:500;color:var(--muted)}

@media (max-width:767px){
  .mini-table .slog-edit{opacity:1}
}


/* ============================================================
   v0.5 · KANAL MODÜLÜNDE DOĞAN COMPONENTLER (26–30. bölümler)
   Bayi & SMMM Kanal Yönetimi'nde ortaya çıktı, tüm modüllerde geçerlidir.
   ============================================================ */

/* --- 26.1 · Hiyerarşi ağacı (kanal, organizasyon, kategori) --- */
.ctree{font-size:13px}
.ctree-node{display:flex;align-items:center;gap:8px;padding:8px 0}
.ctree-node+.ctree-node{border-top:1px solid var(--line)}
.ctree-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.ctree-name{font-weight:600;min-width:0;line-height:1.35;overflow:hidden}
.ctree-name span{display:block;font-size:11.5px;font-weight:500;color:var(--muted)}
.ctree-meta{margin-left:auto;flex-shrink:0;font-size:12px;font-weight:500;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}
.ctree-branch{margin-left:3px;padding-left:16px;border-left:1px solid var(--line)}
.ctree-cap{display:flex;align-items:center;gap:6px;padding:12px 0 2px;font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.ctree-more{display:inline-block;padding:10px 0 0;font-size:12px;font-weight:650;color:var(--brand);cursor:pointer}

/* --- 26.2 · Çoklu ilişki hücresi (bir kayıt birden fazla üste bağlıysa) --- */
.rel-cell{display:flex;align-items:center;gap:6px;min-width:0}
.rel-name{font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:190px}
.rel-more{flex-shrink:0;padding:1px 7px;border-radius:999px;background:var(--brand-soft);color:var(--brand);font-size:11px;font-weight:650;white-space:nowrap}

/* --- 27.1 · Oran hücresi (rakam + mini bar) --- */
.pct{display:flex;align-items:center;gap:8px}
.pct b{font-size:13px;font-weight:650;font-variant-numeric:tabular-nums;min-width:34px}

/* --- 27.2 · Kilitli sistem kaydı (silinemez, düzenlenemez satır) --- */
.lock-ico{width:13px;height:13px;stroke:var(--muted);fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;display:inline-block;vertical-align:-2px;margin-left:6px}
tbody tr.is-sys{background:#FBFCFE}
tbody tr.is-sys:hover{background:var(--brand-soft)}

/* --- 28.1 · Aramalı kayıt seçici (yüzlerce kayıt; select yerine) --- */
.picker{position:relative}
.picker-field{position:relative}
.picker-field > svg{position:absolute;left:10px;top:50%;transform:translateY(-50%);width:16px;height:16px;stroke:var(--muted);fill:none;stroke-width:1.5;stroke-linecap:round}
.picker-field input{
  width:100%;height:36px;
  border:1px solid var(--line);border-radius:8px;background:var(--card);
  padding:0 12px 0 32px;font-family:inherit;font-size:13px;color:var(--ink);
}
.picker-field input::placeholder{color:var(--muted)}
.picker-field input:focus{outline:none;border-color:var(--brand)}
.picker-list{
  margin-top:6px;padding:4px;
  border:1px solid var(--line);border-radius:8px;background:var(--card);
  box-shadow:var(--shadow);max-height:216px;overflow-y:auto;
}
.picker-item{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:6px;cursor:pointer}
.picker-item:hover,.picker-item.is-active{background:var(--brand-soft)}
.picker-meta{min-width:0;line-height:1.3}
.picker-name{font-size:13px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.picker-sub{font-size:12px;font-weight:500;color:var(--muted)}
.picker-item .badge{margin-left:auto;flex-shrink:0;font-size:11px;padding:1px 8px}
.picker-selected{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid var(--brand);background:var(--brand-soft);border-radius:8px}
.picker-clear{
  margin-left:auto;flex-shrink:0;width:28px;height:28px;border:none;background:transparent;
  border-radius:6px;color:var(--muted);cursor:pointer;display:flex;align-items:center;justify-content:center;
}
.picker-clear:hover{background:var(--card);color:var(--danger)}
.picker-clear svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round}
.picker-empty{padding:14px 10px;text-align:center;font-size:12.5px;font-weight:500;color:var(--muted)}

/* --- 28.2 · Tekrarlanan form bloğu (yetkili kişi, kalem grubu) --- */
.sub-block{border:1px solid var(--line);border-radius:8px;padding:16px;margin-bottom:12px}
.sub-block-head{display:flex;align-items:center;gap:8px;margin-bottom:12px}
.sub-block-title{font-size:13px;font-weight:650}
.sub-block-head .badge{font-size:11px;padding:1px 8px}
.sub-block-head .li-del{margin-left:auto}

/* --- 28.3 · Kontrol / etki listesi --- */
.req-list{display:flex;flex-direction:column;gap:9px}
.req-item{display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:500;color:var(--muted)}
.req-item svg{width:16px;height:16px;flex-shrink:0;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;stroke:var(--line)}
.req-item.is-done{color:var(--ink)}
.req-item.is-done svg{stroke:var(--success)}
.req-item.is-stop{color:var(--ink)}
.req-item.is-stop svg{stroke:var(--danger)}
.req-step{margin-left:auto;flex-shrink:0;font-size:11px;font-weight:600;color:var(--muted);white-space:nowrap}
.req-cap{display:block;margin-bottom:8px;font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.req-list+.req-cap{margin-top:16px}

/* --- 29.1 · Belge satırı (sözleşme, dekont, materyal) --- */
.file-row{display:flex;align-items:center;gap:12px;padding:10px 12px;border:1px solid var(--line);border-radius:8px;margin-bottom:8px}
.file-row:last-of-type{margin-bottom:0}
.file-ico{width:32px;height:32px;border-radius:8px;background:var(--bg);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.file-ico svg{width:16px;height:16px;stroke:var(--muted);fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.file-meta{min-width:0;line-height:1.3}
.file-name{font-size:13px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.file-sub{font-size:12px;font-weight:500;color:var(--muted)}
.file-act{margin-left:auto;flex-shrink:0;height:32px;padding:0 12px}

/* --- 29.2 · Geniş modal (iş kuralı taşıyan onaylar) --- */
.modal-wrap .modal.is-lg{max-width:560px}

/* --- 29.3 · Bilgi satırı içinde doğrudan düzenleme --- */
.info-row .slog-edit{opacity:1;margin-left:0}
.info-row .slog-edit:hover{background:var(--brand-soft)}

/* --- 30.1 · Geniş tablo genişlikleri: inline style YERİNE sınıf --------------
   Inline min-width, mobil media query'yi ezer ve tablo kart görünümüne dönemez. */
.data-table.w-1220{min-width:1220px}
.data-table.w-1100{min-width:1100px}
.data-table.w-1300{min-width:1300px}
.data-table.w-1360{min-width:1360px}
.data-table.w-1440{min-width:1440px}

/* --- 30.2 · Sabit kolonlar: ilk kolon solda, aksiyon kolonu sağda --- */
.data-table thead th:first-child,
.data-table tbody td:first-child{
  position:sticky;left:0;z-index:2;
  background:var(--card);
  border-right:1px solid var(--line);
}
.data-table thead th:first-child{background:#F8FAFD;z-index:4}
.data-table tbody tr:hover td:first-child,
.data-table tbody tr.row-selected td:first-child{background:var(--brand-soft)}
.data-table tbody tr.is-sys td:first-child{background:#FBFCFE}
.data-table tbody tr.is-sys:hover td:first-child{background:var(--brand-soft)}

.data-table thead th.td-action,
.data-table tbody td.td-action{
  position:sticky;right:0;z-index:3;
  background:var(--card);
  border-left:1px solid var(--line);
}
.data-table thead th.td-action{background:#F8FAFD;z-index:5}
.data-table tbody tr:hover td.td-action,
.data-table tbody tr.row-selected td.td-action{background:var(--brand-soft)}
.data-table tbody tr.is-sys td.td-action{background:#FBFCFE}
.data-table tbody tr.is-sys:hover td.td-action{background:var(--brand-soft)}

/* Menü açıkken hücre diğer satırların sabit kolonlarının üstüne çıkar */
.data-table tbody td.td-action.is-open{z-index:30}
/* Kart sınırında kırpılmasın diye alt satırlarda menü yukarı açılır */
.row-menu.drop-up .dropdown{top:auto;bottom:36px}

/* ============================================================
   v0.5 · DÜZELTMELER
   ============================================================ */

/* .radio-card span kuralı içteki başlığı da soluklaştırıyordu */
.radio-card b{color:var(--ink)}

/* .chip-filter ile kurulan "Filtreler" butonu yalnızca mobilde görünür */
.chip-filter.filters-btn{display:none}

/* Silinemeyen satırın kaldırma butonu (örn. birincil yetkili) */
.li-del:disabled{opacity:.4;cursor:not-allowed}
.li-del:disabled:hover{border-color:var(--line);color:var(--muted)}

/* Seçim kartı başlığındaki rozet sağa yaslanır */
.pick-card .pick-name .badge{margin-left:auto}

@media (max-width:767px){
  .picker-field input{height:44px}
  .rel-cell{justify-content:flex-end}
  .rel-name{max-width:150px}
  .ctree-branch{padding-left:12px}
  .pct{justify-content:flex-end}
  .pct .hbar{width:56px}
  .req-step{display:none}
  .sub-block{padding:14px}
  .file-row{flex-wrap:wrap}
  .file-act{margin-left:0;width:100%;justify-content:center;min-height:44px;margin-top:4px}
  .chip-filter.filters-btn{display:inline-flex}

  /* Çoklu seçim süzgeci: panel 250px sabit genişlikte ve süzgecin soluna
     hizalı açılıyor; süzgeç satırın ortasındaysa panel ekranın sağından
     taşıyordu. Dar ekranda süzgeç tam satır olur, panel de onun genişliğini
     alır (dokunma hedefi de büyür). */
  .rs-coklu{display:block;width:100%}
  .rs-coklu>summary{width:100%;justify-content:space-between}
  .rs-coklu-panel{min-width:0;width:100%}

  /* Mobilde satırlar karta dönüşür; sabitleme ve geniş genişlik geçersiz.
     Liste TEK TEK yazıldığı için yeni bir genişlik sınıfı (w-1100) eklendiğinde
     unutuldu ve Kontör ekranı telefonda 1116px'e kadar yana kayıyordu; kural
     artık .data-table'ın bütün w-… sınıflarını kapsıyor. Koruma:
     TestSabitTabloGenislikleriMobildeSifirlanir. */
  .data-table.w-880,.data-table.w-1100,.data-table.w-1220,
  .data-table.w-1300,.data-table.w-1360,.data-table.w-1440{min-width:0}
  .data-table thead th:first-child,
  .data-table tbody td:first-child{
    position:static;left:auto;z-index:auto;background:transparent;border-right:none;
  }
  .data-table tbody td.td-action{
    position:absolute;top:10px;right:10px;left:auto;z-index:auto;
    background:transparent;border-left:none;
  }
  .row-menu.drop-up .dropdown{top:36px;bottom:auto}

  /* Kart içi mini tablolar kart görünümüne DÖNMEZ; yatay kayan tablo kalır.
     Genel "tablo → kart" kuralı .mini-table'ı da yakalıyordu. */
  .mini-table{display:table;min-width:560px}
  /* Üç dar sütunluk listeler için 560px gereksiz: telefonda sayfayı taşırıyor.
     .mt-dar sınıfı bu kuralı sıfırlar (özgüllük eşit olsun diye .mini-table
     ile birlikte yazıldı). */
  .mini-table.mt-dar{min-width:0}
  .mini-table thead{display:table-header-group}
  .mini-table tbody{display:table-row-group}
  .mini-table tbody tr{display:table-row;background:transparent;border:none;box-shadow:none;padding:0;margin:0;border-radius:0}
  .mini-table tbody td{display:table-cell;padding:12px 12px 12px 0;border-bottom:1px solid var(--line)}
  .mini-table tbody tr:last-child td{border-bottom:none}
}


/* ============================================================
   FİRMALAR MODÜLÜ EKLERİ — SHELL'E EKLENMELİ (v0.7)
   ============================================================ */

/* --- Sidebar 22 maddeye çıktı: grup başlıkları yapışkan --- */
.nav-group-title{position:sticky;top:0;z-index:3;background:rgba(13,45,80,.94);backdrop-filter:blur(4px)}

/* --- .id-badge · kimlik tipi rozeti (31. bölüm) ---------------
   Kayıt anahtarı ile fatura kimliğini tek bakışta ayırır.
   VKN/TCKN nötr · geçici anahtar warning · 11111111111 danger. */
.id-badge{
  display:inline-flex;align-items:center;gap:6px;white-space:nowrap;
  padding:2px 9px;border-radius:999px;border:1px solid transparent;
  font-size:12px;font-weight:600;
}
.id-badge .k{font-size:10px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;opacity:.7}
.id-badge .v{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.id-badge.id-vkn,.id-badge.id-tckn{background:var(--bg);color:var(--ink);border-color:var(--line)}
.id-badge.id-temp{background:var(--warning-soft);color:var(--warning)}
.id-badge.id-null{background:var(--danger-soft);color:var(--danger)}
.id-badge.id-lg{padding:4px 12px;font-size:13px}
.id-badge.id-lg .v{font-size:13px}

/* --- .countdown · kimlik geri sayımı (31. bölüm) --------------
   Türetilmiş veri: ödeme doğrulama tarihi + bekleme süresi − bugün.
   Eşik üstü satışlarda danger ve "iade riski" ibaresi taşır. */
.countdown{
  display:inline-flex;align-items:center;gap:5px;white-space:nowrap;
  padding:2px 9px;border-radius:999px;
  background:var(--warning-soft);color:var(--warning);
  font-size:12px;font-weight:600;font-variant-numeric:tabular-nums;
}
.countdown svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.countdown.is-danger{background:var(--danger-soft);color:var(--danger)}
.countdown.is-done{background:var(--bg);color:var(--muted)}
.countdown .why{font-weight:500;opacity:.85}

/* --- Henüz tasarlanmamış sekmelerin açıklama satırı --- */
.tab-panel-note{font-size:13px;font-weight:500;color:var(--muted);line-height:1.6}
.tab-panel-note b{color:var(--ink);font-weight:600}
.tab-panel-note code{
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;
  background:var(--bg);border:1px solid var(--line);border-radius:4px;padding:1px 5px;color:var(--ink);
}

/* --- .ws-mini içine sağ ok aksiyonu (mevcut component eki) --- */
.ws-mini .go{
  width:28px;height:28px;flex-shrink:0;border:none;background:transparent;
  border-radius:6px;color:var(--muted);cursor:pointer;
  display:flex;align-items:center;justify-content:center;
}
.ws-mini:hover .go{color:var(--brand)}
.ws-mini .go svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.ws-mini .ws-meta{min-width:0;flex:1}

/* --- Prototip: view geçişi için tıklanabilir alanlar --- */
[data-go]{cursor:pointer}

@media (max-width:767px){
  .id-badge{font-size:11px}
  .ws-mini .go{width:44px;height:44px}
}

/* Satır menüsünde yıkıcı aksiyon */
.dd-item.is-danger{color:var(--danger)}
.dd-item.is-danger svg{stroke:var(--danger)}
.dd-item.is-danger:hover{background:var(--danger-soft)}

/* Kayıt kontrolünde hatalı madde */
.req-item.is-error{color:var(--danger)}
.req-item.is-error svg{stroke:var(--danger)}


/* [hidden] her zaman gizlensin — .form-grid gibi display kuralları ezmesin */
[hidden]{display:none !important}

/* Eğitim & SSS modülü */
.pick-card .pick-top{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}
.pick-card .pick-title{font-weight:600;font-size:14px;line-height:1.35;margin-bottom:6px}
.pick-card .pick-desc{font-size:12.5px;color:var(--muted);line-height:1.45;margin-bottom:12px}
.btn-sm{height:28px;padding:0 12px;font-size:12.5px}
.form-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}
@media (max-width:900px){.form-grid-2{grid-template-columns:1fr}}
.faq{display:flex;flex-direction:column}
.faq-item{border-bottom:1px solid var(--border)}
.faq-item:last-child{border-bottom:0}
.faq-item>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:10px;padding:14px 4px;font-weight:500}
.faq-item>summary::-webkit-details-marker{display:none}
.faq-item>summary::after{content:"+";margin-left:auto;font-size:18px;color:var(--muted);transition:transform .15s}
.faq-item[open]>summary::after{content:"–"}
.faq-item>summary .faq-q{flex:1}
.faq-item[open]>summary{color:var(--brand)}
.faq-a{padding:0 4px 16px;color:var(--muted);font-size:13px;line-height:1.55}

/* Sistem Ayarları */
.setting-list{display:flex;flex-direction:column}
.setting-row{display:flex;align-items:center;gap:16px;padding:16px 4px;border-bottom:1px solid var(--border)}
.setting-row:last-child{border-bottom:0}
.setting-meta{flex:1;min-width:0}
.setting-title{font-weight:600;font-size:14px;margin-bottom:4px}
.setting-desc{font-size:12.5px;color:var(--muted);line-height:1.5}
.setting-action{display:flex;align-items:center;gap:10px;flex-shrink:0}
.cust-head-action{margin-left:auto;align-self:flex-start}

/* ============================================================
   WORKSPACE'LER — firma-gruplu liste (v0.2 referans)
   ============================================================ */
.fw-grp{background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);margin-bottom:12px;overflow:hidden}
.fw-grp:last-of-type{margin-bottom:0}
.fw-head{display:flex;align-items:center;gap:12px;padding:14px 20px;border-bottom:1px solid var(--line)}
.fw-meta{min-width:0;line-height:1.3}
.fw-name{font-size:13.5px;font-weight:650;letter-spacing:-.01em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:420px}
.fw-sub{font-size:12px;font-weight:500;color:var(--muted)}
.fw-right{display:flex;align-items:center;gap:20px;margin-left:auto;flex-shrink:0}
.fw-count{font-size:12px;font-weight:500;color:var(--muted);white-space:nowrap}
.fw-mrr{font-size:14px;font-weight:700;letter-spacing:-.01em;font-variant-numeric:tabular-nums;white-space:nowrap}
.fw-toggle{width:32px;height:32px;border-radius:8px;border:none;background:transparent;color:var(--muted);cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.fw-toggle:hover{background:var(--bg);color:var(--ink)}
.fw-toggle svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;transition:transform .15s}
.fw-grp.is-closed .fw-toggle svg{transform:rotate(-90deg)}
.fw-grp.is-closed .fw-body{display:none}
.fw-grp.is-closed .fw-head{border-bottom:none}
.fw-body .table-card{border:none;border-radius:0;box-shadow:none}
.idkey{font-variant-numeric:tabular-nums}
.idkey.is-temp{color:var(--warning);font-weight:600}
.akt{font-size:13.5px;font-weight:650;font-variant-numeric:tabular-nums;color:var(--success)}
.akt.is-mid{color:var(--warning)}
.akt.is-low{color:var(--danger)}
.prods{font-size:13px;font-weight:500;white-space:nowrap}
.data-table.w-880{min-width:880px}
@media (max-width:1199px){.fw-right{gap:14px}.fw-name{max-width:240px}}
@media (max-width:767px){
  .fw-grp{background:transparent;border:none;box-shadow:none;overflow:visible;margin-bottom:20px}
  .fw-head{background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);padding:14px 16px;flex-wrap:wrap;margin-bottom:12px}
  .fw-name{max-width:none;white-space:normal}
  .fw-right{margin-left:0;width:100%;justify-content:space-between;gap:12px;padding-top:10px;border-top:1px solid var(--line)}
  .fw-toggle{width:44px;height:44px}
  .fw-body .table-card{background:transparent}
  .data-table.w-880{min-width:0}
  .prods{white-space:normal;text-align:right}
  .akt{text-align:right}
}

/* Workspace 360 — bağlam yolu + entegrasyon hücresi + başlık menüsü + bar chart */
.ctx-path{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding-bottom:14px;margin-bottom:14px;border-bottom:1px solid var(--line);font-size:12.5px;font-weight:500;color:var(--muted)}
.ctx-crumb{color:var(--brand);font-weight:600;white-space:nowrap}
.ctx-crumb:hover{text-decoration:underline}
.ctx-path b{font-weight:650;color:var(--ink);white-space:nowrap}
.ctx-sep{width:14px;height:14px;stroke:var(--line);fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.ctx-path-note{margin-left:auto;font-size:11.5px;white-space:nowrap}
.int-cell{display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:500;white-space:nowrap}
.int-cell i{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.hdr-menu{position:relative}
.hdr-menu .dropdown{position:absolute;top:42px;right:0;z-index:45;width:224px;display:none;text-align:left}
.hdr-menu.open .dropdown{display:block}
.bar-chart{width:100%;height:auto}
.bar-lbl{font-size:9px;font-weight:500;fill:var(--muted)}
@media (max-width:767px){.ctx-path{gap:6px}.ctx-path-note{margin-left:0;width:100%}}

/* --- Workspace 360 · Entegrasyonlar sekmesi -------------------------------- */
.ent-grup{margin-top:14px}
.ent-item{border:1px solid var(--line);border-radius:10px;padding:12px 14px;margin-bottom:10px;background:var(--card)}
.ent-item-head{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.ent-item-name{display:flex;align-items:center;gap:8px}
.ent-item-name b{font-size:14px}
.ent-item-act{display:flex;align-items:center;gap:6px}
.ent-inline{display:inline;margin:0}
.ent-meta{font-size:12px;color:var(--muted);margin-top:6px}
.ent-meta b{color:var(--ink);font-weight:600}
.ent-hata{color:var(--danger)}
.ent-keys{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.ent-key{display:inline-flex;flex-direction:column;gap:1px;background:var(--bg,#f6f7f9);border:1px solid var(--line);border-radius:8px;padding:5px 9px;min-width:90px}
.ent-key .k{font-size:10px;text-transform:uppercase;letter-spacing:.03em;color:var(--muted)}
.ent-key .v{font-size:12.5px;font-weight:600;font-variant-numeric:tabular-nums}
.ent-edit,.ent-add{margin-top:10px}
.ent-edit>summary,.ent-add>summary{cursor:pointer;font-size:12.5px;font-weight:600;color:var(--brand);list-style:none;user-select:none}
.ent-edit>summary::-webkit-details-marker,.ent-add>summary::-webkit-details-marker{display:none}
.ent-add>summary{color:var(--muted)}
.ent-edit[open]>summary,.ent-add[open]>summary{margin-bottom:10px}
.ent-form-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px}
.ent-form-grid label{display:flex;flex-direction:column;gap:4px;font-size:12px;font-weight:600;color:var(--muted)}
.ent-form-grid input,.ent-form-grid select{font-size:13px;padding:7px 9px;border:1px solid var(--line);border-radius:8px;background:var(--card);color:var(--ink);font-weight:500}
.ent-form-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:12px;flex-wrap:wrap}

/* --- Workspace 360 · Aktivasyon & Onboarding sekmesi ----------------------- */
.txt-success{color:var(--success)}
.txt-warning{color:var(--warning)}
.txt-danger{color:var(--danger)}
.progress i.p-brand{background:var(--brand)}
.akt-brk-title{font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);font-weight:700;margin:16px 0 10px;padding-top:14px;border-top:1px solid var(--line)}
.akt-brk{display:grid;grid-template-columns:1fr 1fr;gap:8px 22px}
@media (max-width:720px){.akt-brk{grid-template-columns:1fr}}

/* Onboarding stepper (referans tasarımı) */
.onb-card{margin-bottom:14px}
.stepper{display:flex;align-items:flex-start;gap:6px;margin:18px 0 4px}
.step{display:flex;align-items:flex-start;gap:10px;flex-shrink:0}
.step-dot{width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;flex-shrink:0;border:1.5px solid var(--line);background:var(--card);color:var(--muted);transition:.15s}
.step-dot svg{width:15px;height:15px;stroke:#fff;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.step.done .step-dot{background:var(--success);border-color:var(--success);color:#fff}
.step.current .step-dot{background:var(--brand);border-color:var(--brand);color:#fff;box-shadow:0 0 0 4px color-mix(in srgb,var(--brand) 18%,transparent)}
.step-label{font-size:13px;font-weight:600;color:var(--muted);white-space:nowrap;line-height:1.25}
.step-sub{font-size:11px;font-weight:600;color:var(--muted);margin-top:2px}
.step.done .step-label{color:var(--ink)}
.step.done .step-sub{color:var(--success)}
.step.current .step-label{color:var(--brand)}
.step.current .step-sub{color:var(--brand)}
.step-line{flex:1;height:2px;background:var(--line);min-width:20px;margin-top:14px;border-radius:2px}
.step-line.done{background:var(--success)}
.onb-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:16px;padding-top:12px;border-top:1px solid var(--line)}
.onb-chips{display:flex;flex-wrap:wrap;gap:8px}
.onb-chip{display:inline-flex;flex-direction:column;gap:1px;background:var(--bg,#f6f7f9);border:1px solid var(--line);border-radius:8px;padding:5px 11px}
.onb-chip .k{font-size:10px;text-transform:uppercase;letter-spacing:.03em;color:var(--muted);font-weight:600}
.onb-chip .v{font-size:12.5px;font-weight:600;color:var(--ink)}
@media (max-width:720px){.stepper{flex-direction:column;align-items:flex-start;gap:14px}.step-line{display:none}}

/* --- Workspace slide-over: zengin içerik --------------------------------- */
.sw-brk-item{margin-bottom:9px}
.sw-brk-item:last-child{margin-bottom:2px}
.sw-brk-head{display:flex;justify-content:space-between;gap:8px;font-size:12px;margin-bottom:4px}
.sw-brk-head span{color:var(--muted)}
.sw-brk-head b{color:var(--ink);font-weight:600;white-space:nowrap}
.progress.sw-brk-bar{height:5px}
a.ws-mini{text-decoration:none;color:inherit;transition:.12s}
a.ws-mini:hover{border-color:var(--brand);background:var(--bg,#f6f7f9)}

/* --- Leadler · Kanban panosu (referans) ----------------------------------- */
/* Lead panosu: sütunlar tek satırda, yükseklikleri eşit; dar ekranda pano
   yatay kayar. Sütunlar satıra sarınca hangi aşamanın nerede olduğu
   kayboluyordu. */
.kanban{display:flex;gap:12px;overflow-x:auto;padding-bottom:8px;
  /* Yatay kaydırmada sütunlar hizada dursun: telefonda sütunun yarısında
     kalmak hangi aşamaya baktığını belirsizleştiriyordu. */
  scroll-snap-type:x proximity;
  /* Sütunlar içerikleri kadar: eşit yükseklik verildiğinde tek dolu aşama
     bütün boş sütunları ekran boyuna çekiyor ve pano bomboş görünüyordu. */
  align-items:flex-start}
.kb-col{flex:0 0 258px;width:258px;scroll-snap-align:start;background:var(--bg);border:1px solid var(--line);
  border-radius:12px;padding:12px;display:flex;flex-direction:column;gap:10px;
  /* Boş sütun da rahat bırakılabilecek kadar yüksek kalır; dolu sütun
     ekranı aşmadan kendi içinde kayar. */
  min-height:180px;max-height:calc(100vh - 300px)}
/* Kart listesi sütun içinde kayar: uzun aşama diğerlerini aşağı itmesin. */
.kb-col .kb-kartlar{flex:1;min-height:0;overflow-y:auto;display:flex;flex-direction:column;
  gap:9px;padding-right:2px;overscroll-behavior:contain}
.kb-col .kb-kartlar::-webkit-scrollbar{width:6px}
.kb-col .kb-kartlar::-webkit-scrollbar-thumb{background:var(--line);border-radius:3px}
.kb-col .kb-kartlar::-webkit-scrollbar-thumb:hover{background:var(--muted)}
.kb-col .kb-head{position:sticky;top:0;background:var(--bg);z-index:1;padding-bottom:6px;
  border-bottom:1px solid var(--line)}
.kb-bos{padding:16px 8px;text-align:center;font-size:12px;color:var(--muted);
  border:1px dashed var(--line);border-radius:9px}
.kb-head{display:flex;align-items:center;gap:8px}
.kb-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.kb-name{font-size:13.5px;font-weight:650}
.kb-count{margin-left:auto;padding:1px 8px;border-radius:999px;background:var(--card);border:1px solid var(--line);font-size:11px;font-weight:650;color:var(--muted);font-variant-numeric:tabular-nums}
.kb-card{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:12px;box-shadow:var(--shadow);cursor:pointer}
.kb-card:hover{border-color:var(--brand)}
.kb-title{font-size:13px;font-weight:650;line-height:1.35}
.kb-sub{font-size:12px;font-weight:500;color:var(--muted);margin-top:2px}
.kb-chips{display:flex;flex-wrap:wrap;gap:4px;margin-top:10px}
.kb-foot{display:flex;align-items:center;flex-wrap:wrap;gap:6px;margin-top:10px;padding-top:10px;border-top:1px solid var(--line);font-size:11.5px;font-weight:500;color:var(--muted)}
.kb-foot.is-late{color:var(--danger);font-weight:600}
.kb-foot .monogram{margin-right:2px}

/* --- Leadler · İlk temas SLA hücresi (referans) ---------------------------- */
.sla{display:flex;align-items:flex-start;gap:7px;font-size:12.5px;font-weight:600;white-space:nowrap;line-height:1.35}
.sla svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;margin-top:1px}
.sla .sla-sub{display:block;font-size:11px;font-weight:500;color:var(--muted)}
.sla-ok{color:var(--success)}
.sla-soon{color:var(--warning)}
.sla-over{color:var(--danger)}
.lead-table{min-width:960px}
/* Mobilde tablo kart görünümüne döner (bkz. "Tablo → kart görünümü"); oradaki
   table{min-width:0} kuralını .lead-table daha özel olduğu için eziyordu.
   Sonuç: sayfa 960px genişliğinde kalıyor, telefon bütün ekranı küçültüp
   gösteriyordu — leadler modülünde "mobil bozuk" görüntüsünün ana sebebi. */
@media (max-width:767px){.lead-table{min-width:0}}

/* --- Açılır bölüm (Detay ekle) — referans .disc --------------------------- */
.disc{border:1px solid var(--line);border-radius:8px;overflow:hidden}
.disc>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:8px;padding:12px 16px;background:var(--bg);font-size:13px;font-weight:600;color:var(--brand)}
.disc>summary::-webkit-details-marker{display:none}
.disc>summary svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;transition:transform .15s}
.disc[open]>summary svg{transform:rotate(90deg)}
.disc>summary span{margin-left:auto;font-size:12px;font-weight:500;color:var(--muted)}
.disc-body{padding:16px;display:flex;flex-direction:column;gap:16px;border-top:1px solid var(--line)}

/* --- Leadler kanban sürükle-bırak ---------------------------------------- */
.kb-card{cursor:grab}
.kb-card:active{cursor:grabbing}
.kb-card.dragging{opacity:.45;box-shadow:0 8px 20px rgba(15,49,86,.18)}
.kb-col.drop-over{background:var(--brand-soft);border-color:var(--brand);box-shadow:inset 0 0 0 1px var(--brand)}

/* --- Satış Pipeline · Kanban tahtası (referans) --------------------------- */
.board{display:flex;gap:12px;align-items:flex-start;overflow-x:auto;padding-bottom:8px}
.col{flex:1 1 216px;min-width:216px;max-width:320px;background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);display:flex;flex-direction:column}
.col-head{padding:14px;border-bottom:1px solid var(--line);border-radius:12px 12px 0 0;background:#F8FAFD}
.col-name{display:flex;align-items:center;gap:8px;font-size:13.5px;font-weight:650;letter-spacing:-.01em}
.col-name i{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.col-name .cnt{margin-left:auto;background:var(--card);border:1px solid var(--line);color:var(--muted);font-size:11px;font-weight:650;min-width:20px;height:20px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;padding:0 6px;font-variant-numeric:tabular-nums}
.col-sum{display:flex;align-items:baseline;gap:5px;margin-top:8px;font-size:12px;font-weight:500;color:var(--muted)}
.col-sum b{font-size:15px;font-weight:700;letter-spacing:-.01em;color:var(--ink);font-variant-numeric:tabular-nums}
.col-body{padding:12px;display:flex;flex-direction:column;gap:10px;min-height:104px;border-radius:0 0 12px 12px}
.col-body.is-over{background:var(--brand-soft)}
.col-empty{border:1px dashed var(--line);border-radius:8px;padding:14px 12px;text-align:center;font-size:12px;font-weight:500;color:var(--muted)}
.col.is-won .col-head{background:var(--success-soft)}
.col.is-lost .col-head{background:var(--danger-soft)}
.kcard{border:1px solid var(--line);border-radius:12px;background:var(--card);padding:12px;cursor:grab;transition:border-color .15s,box-shadow .15s}
.kcard:hover{border-color:var(--brand);box-shadow:var(--shadow)}
.kcard:active{cursor:grabbing}
.kcard.is-drag{opacity:.45}
.kcard-top{display:flex;align-items:flex-start;gap:8px}
.kcard-name{font-size:13px;font-weight:650;line-height:1.35;min-width:0}
.kcard-sub{font-size:12px;font-weight:500;color:var(--muted);margin-top:1px}
.kcard-amt{display:flex;align-items:baseline;gap:5px;margin-top:6px}
.kcard-amt b{font-size:16px;font-weight:750;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.kcard-amt span{font-size:11.5px;font-weight:500;color:var(--muted)}
.kcard-flags{margin-top:8px}
.kcard-foot{display:flex;align-items:center;gap:8px;margin-top:10px;padding-top:10px;border-top:1px solid var(--line);font-size:11.5px;font-weight:500;color:var(--muted)}
.kcard-foot .monogram{margin-left:auto}
.kcard-date{display:inline-flex;align-items:center;gap:5px;white-space:nowrap}
.kcard-date svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.kcard-date.is-late{color:var(--danger);font-weight:600}
.flag{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:999px;font-size:11px;font-weight:600;white-space:nowrap}
.flag svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.flag-warning{background:var(--warning-soft);color:var(--warning)}
.flag-danger{background:var(--danger-soft);color:var(--danger)}
.flag-accent{background:var(--accent-soft);color:var(--accent)}
.flag-neutral{background:var(--bg);color:var(--muted)}

/* ---------- TEKLİF MODÜLÜ (referans wegs_teklifler_v02 · v0.6 componentleri) ---------- */
/* Üstü çizili liste fiyatı (indirimli tutar hücresi) */
.strike{display:block;margin-top:1px;font-size:11px;font-weight:500;color:var(--muted);text-decoration:line-through;font-variant-numeric:tabular-nums}
/* Çok satırlı hücre değeri sarmalayıcısı (ana değer + alt bilgi tek parça) */
.tv{display:block;min-width:0}
/* Revizyon rozeti (teklif no yanında) */
.rev{display:inline-flex;align-items:center;margin-left:6px;padding:0 6px;height:16px;border-radius:4px;background:var(--bg);border:1px solid var(--line);font-size:10.5px;font-weight:700;color:var(--muted);font-variant-numeric:tabular-nums;vertical-align:1px}
/* Liste hücresinde alt kayıt satırı (firmalar / müşteri) */
.cust-owner-line{display:flex;align-items:center;gap:5px;margin-top:3px;font-size:11.5px;font-weight:500;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cust-owner-line svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
/* Ad + rozet satırı (liste hücresi) */
.cust-name-row{display:flex;align-items:center;gap:8px;min-width:0}
.cust-name-row .cust-name{max-width:none;min-width:0;overflow:hidden;text-overflow:ellipsis}
.cust-name-row .badge{flex-shrink:0}
/* Risk vurgusu (tavan üstü indirim / süresi geçmiş) */
.num.is-risk{color:var(--danger)}
.cell-sub.is-risk{color:var(--danger);font-weight:600}
/* Bağlantı olarak KPI kartı ve sekme */
a.kpi-card{display:block;color:inherit;text-decoration:none}
a.tab{text-decoration:none}

/* Teklif formu · firma blokları (referans 31.x/32.x) */
.thr{display:flex;align-items:flex-start;gap:10px;padding:10px 12px;border:1px solid;border-radius:8px;font-size:12.5px;font-weight:500;line-height:1.5}
.thr svg{width:16px;height:16px;flex-shrink:0;margin-top:1px;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.thr b{font-weight:650}
.thr-ok{background:var(--success-soft);border-color:#BFE8D4;color:#0A7A4B}
.thr-warn{background:var(--warning-soft);border-color:#F3D9A8;color:var(--warning)}
.thr-info{background:var(--brand-soft);border-color:#C9E0F5;color:#0E5C9E}
/* Şablonlarda iki ad da kullanılmış; ikisi de tanımlı olmazsa şerit renksiz
   kalıyor (border-color'sız 1px kenarlık + arka plan yok). */
.thr-warning{background:var(--warning-soft);border-color:#F3D9A8;color:var(--warning)}
.thr-danger{background:var(--danger-soft);border-color:#F5C9CD;color:var(--danger)}
.blk-tot{margin-left:auto;text-align:right;flex-shrink:0}
.blk-tot .lbl{display:block;font-size:11.5px;font-weight:500;color:var(--muted)}
.blk-tot .val{font-size:15px;font-weight:700;font-variant-numeric:tabular-nums}
.blk-add{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;height:40px;border:1px dashed var(--line);border-radius:8px;background:var(--card);font-family:inherit;font-size:13px;font-weight:600;color:var(--brand);cursor:pointer}
.blk-add svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round}
.blk-line{display:flex;align-items:baseline;gap:10px;padding:7px 0;font-size:12.5px;border-bottom:1px dashed var(--line)}
.blk-line:last-of-type{border-bottom:0}
.blk-line .lbl{color:var(--muted);font-weight:500;min-width:0;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.blk-line .val{font-weight:650;font-variant-numeric:tabular-nums;flex-shrink:0}
.ws-state{display:flex;align-items:center;gap:6px;margin-top:6px;font-size:12px;font-weight:500;color:var(--muted)}
.ws-state svg{width:13px;height:13px;flex-shrink:0;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.ws-state b{font-weight:650}
.ws-state.is-warning{color:var(--warning)}
/* Müşteri bağlam şeridi — müşteri seçilmez, ilk firmadan türetilir */
.ctx-cust{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.ctx-cust-meta{min-width:0;flex:1}
.ctx-cust-name{font-size:13.5px;font-weight:650;line-height:1.3}
.ctx-cust-sub{font-size:12px;font-weight:500;color:var(--muted);margin-top:2px}
.ctx-cust .badge{flex-shrink:0}
@media (max-width:767px){
  .blk-tot{margin-left:0;text-align:left;width:100%;padding-top:8px;border-top:1px solid var(--line)}
  .blk-tot .val{font-size:16px}
  .blk-add{height:44px}
}

/* Teklif PDF önizleme (referans 31.4/31.x) */
.doc-bar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:16px}
.doc-bar .doc-spacer{flex:1}
.doc-stage{
  background:#E6ECF3;border:1px solid var(--line);border-radius:12px;
  padding:24px;overflow-x:auto;
}
.pdfdoc{
  width:794px;max-width:100%;margin:0 auto;
  background:#fff;border:1px solid var(--line);
  box-shadow:var(--shadow);
  padding:40px 44px;font-size:12px;line-height:1.6;color:var(--ink);
}
.pdf-head{display:flex;justify-content:space-between;gap:24px;padding-bottom:18px;border-bottom:2px solid var(--navy)}
.pdf-brand{display:flex;gap:10px;align-items:flex-start}
.pdf-brand .logo-mark{width:36px;height:36px;border-radius:10px;font-size:16px}
.pdf-co{font-size:15px;font-weight:700;letter-spacing:-.02em;line-height:1.3}
.pdf-co span{display:block;font-size:11px;font-weight:500;color:var(--muted);line-height:1.65;letter-spacing:0}
.pdf-doc-t{text-align:right;flex-shrink:0}
.pdf-doc-t b{display:block;font-size:19px;font-weight:750;letter-spacing:.08em;line-height:1.2}
.pdf-doc-t span{display:block;font-size:11px;font-weight:500;color:var(--muted);line-height:1.7}
.pdf-doc-t span em{font-style:normal;font-weight:650;color:var(--ink);font-variant-numeric:tabular-nums}
.pdf-parties{display:grid;grid-template-columns:1fr 1fr;gap:24px;padding:20px 0 22px}
.pdf-cap{font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
.pdf-party{font-size:11.5px;line-height:1.75;color:var(--muted)}
.pdf-party b{display:block;font-size:13px;font-weight:650;color:var(--ink);line-height:1.4;margin-bottom:2px}
.pdf-scroll{overflow-x:auto}
.pdf-table{width:100%;border-collapse:collapse;font-size:11.5px}
.pdf-table th{
  background:var(--bg);text-align:left;padding:8px 10px;
  font-size:10px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);
  border-bottom:1px solid var(--line);white-space:nowrap;
}
.pdf-table td{padding:9px 10px;border-bottom:1px solid var(--line);vertical-align:top;line-height:1.5}
.pdf-table tbody tr:hover{background:transparent}
.pdf-table .r{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.pdf-table .li-name{font-weight:650}
.pdf-table .li-desc{display:block;font-size:10.5px;font-weight:500;color:var(--muted);margin-top:1px}
.pdf-table tr.pdf-sec td{
  background:var(--bg);padding:7px 10px;
  font-size:11px;font-weight:700;color:var(--ink);
  border-bottom:1px solid var(--line);
}
.pdf-table tr.pdf-sec em{display:block;font-style:normal;font-size:10.5px;font-weight:500;color:var(--muted);margin-top:1px}
.pdf-tot{width:308px;max-width:100%;margin:16px 0 0 auto}
.pdf-terms{margin-top:26px;padding-top:16px;border-top:1px solid var(--line);font-size:11px;color:var(--muted);line-height:1.8}
.pdf-terms b{display:block;font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--ink);margin-bottom:6px}
.pdf-terms ul{margin:0;padding-left:16px}
.pdf-sign{display:grid;grid-template-columns:1fr 1fr;gap:32px;margin-top:32px}
.pdf-sign div{border-top:1px solid var(--line);padding-top:8px;font-size:10.5px;color:var(--muted);line-height:1.7}
.pdf-sign b{display:block;font-size:11.5px;font-weight:650;color:var(--ink)}
.pdf-foot{
  margin-top:24px;padding-top:12px;border-top:1px solid var(--line);
  font-size:10px;font-weight:500;color:var(--muted);text-align:center;line-height:1.7;
}

/* Yazdırma: belge dışındaki panel öğeleri gizlenir (tarayıcıdan PDF üretimi) */
@media print{
  .sidebar,.header,.doc-bar,.back-link,.page-head,.alert,.so-overlay,.slideover{display:none!important}
  /* Ekranda yüzen hiçbir şey kâğıda basılmaz: sohbet balonu, bildirim, ipucu,
     satır menüsü, modal, yükleniyor çubuğu. Belgeye ait olmayan her öğe
     çıktıda ya lekedir ya da metnin üstüne biner. */
  /* .as-liste de yüzer (position:fixed): açık kalmış bir liste çıktıda
     metnin üstüne binerdi. */
  .sk-dugme,.sk-pencere,.toast,.tip,.score-pop,.nav-progress,
  .modal-wrap,.kk-ort,.dropdown,.as-liste{display:none!important}
  .main{margin-left:0!important}
  body{background:#fff}
  .doc-stage{background:#fff;border:0;border-radius:0;padding:0;overflow:visible}
  .pdfdoc{width:auto;max-width:none;border:0;box-shadow:none;padding:0}
  .pdf-scroll{overflow:visible}
  /* Dar pencereden yazdırılırsa mobil kart kuralı devreye girmesin. */
  .pdfdoc table{display:table; width:100%}
  .pdfdoc thead{display:table-header-group}
  .pdfdoc tbody{display:table-row-group}
  .pdfdoc tbody tr{display:table-row; background:none; border:0; box-shadow:none; padding:0; margin:0}
  .pdfdoc tbody td{display:table-cell}
  .pdfdoc tbody td[data-label]::before{content:none}
  /* Satır sayfa ortasından bölünmesin. */
  .pdfdoc tbody tr{break-inside:avoid; page-break-inside:avoid}
  .pdfdoc thead{display:table-header-group}
}
/* PDF kalem tablosu A4 genişliğine sığar (kolon taşması yok) */
.pdf-table{table-layout:fixed;min-width:0}
.pdf-table td,.pdf-table th{overflow-wrap:anywhere}
/* Kayıt kontrolleri: durum metni satır kırmasın */
#tk-kontrol .info-row .val{white-space:nowrap}

/* Teklif detay: firma blok başlığı + zincir + onay kutusu (referans) */
.approve-box{border:1px solid var(--warning);background:var(--warning-soft);border-radius:8px;padding:12px 14px}
.approve-box .limit-head{color:var(--warning)}
.approve-box .limit-head b{color:var(--warning)}
.chain{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:12px;font-weight:500;line-height:1.4}
.chain-node{
  display:inline-flex;align-items:center;gap:6px;min-width:0;max-width:100%;
  padding:3px 10px;border:1px solid var(--line);background:var(--card);
  border-radius:999px;color:var(--ink);
}
.chain-node .cn-cap{color:var(--muted);flex-shrink:0}
.chain-node b{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.chain-node.is-planned{border-style:dashed;background:transparent;color:var(--muted)}
.chain-node.is-planned b{font-weight:500}
.chain-sep{color:var(--muted);flex-shrink:0}
.blk-head{
  display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  padding:12px 16px;margin-bottom:16px;
  background:#F8FAFD;border:1px solid var(--line);border-radius:8px;
}
.blk-ix{
  width:24px;height:24px;border-radius:6px;flex-shrink:0;
  background:var(--brand-soft);color:var(--brand);
  font-size:12px;font-weight:700;
  display:flex;align-items:center;justify-content:center;
}
.blk-meta{min-width:0;flex:1}
.blk-name{font-size:13.5px;font-weight:650;line-height:1.3}
.blk-sub{font-size:12px;font-weight:500;color:var(--muted);margin-top:3px}

/* Seçici: "yeni kayıt aç" eylemi listenin içinde değil, aramanın hemen altında
   sabit durur (liste uzadıkça erişimi zorlaşmasın). */
.picker-new{
  display:flex;align-items:center;gap:10px;margin-top:8px;padding:10px 12px;
  border:1px dashed var(--brand);border-radius:8px;background:var(--brand-soft);
  color:var(--ink);text-decoration:none;
}
.picker-new:hover{background:#DCEBF9}
.picker-new-ico{
  width:28px;height:28px;border-radius:8px;flex-shrink:0;background:var(--brand);color:#fff;
  display:flex;align-items:center;justify-content:center;
}
.picker-new-ico svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round}
.picker-new .picker-meta{display:block}
.picker-new .picker-name{display:block;color:var(--brand)}
.picker-new .picker-sub{display:block;white-space:normal}
.picker-cap{margin-top:12px;font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.picker-empty{padding:10px;font-size:12.5px;font-weight:500;color:var(--muted)}
/* Hızlı kayıt modalı: seçici eylemi buton olduğu için form stilini sıfırla */
button.picker-new{width:100%;text-align:left;font-family:inherit;cursor:pointer}
.modal .radio-list{display:flex;flex-direction:column;gap:8px}
/* Modal içinde iki kolonlu alan ızgarası. Sınıf 14 şablonda kullanılıyordu
   ama karşılığı yoktu: alanlar tek tek alt alta diziliyor, modal gereksiz
   uzuyordu. (.form-row ve .rs-grafikler ile aynı kusur sınıfı: söz verilmiş
   ama tanımlanmamış sınıf.) */
.modal-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px}
.modal .modal-grid .modal-field{margin-bottom:0}
/* Modal içinde form: radio-card'lar .modal-field label kurallarına yenik düşmesin */
.modal.is-form{max-width:600px}
/* Teklif › Hızlı firma kaydı: ortak firma formu (firma_form.html) pencerede.
   Kartlar pencere zeminine gömülür; iki sütunlu ızgara dar pencerede tek sütun. */
.modal-wrap .modal.fh-modal{max-width:820px}
.fh-govde .card{box-shadow:none;border:1px solid var(--line)}
.modal-field .radio-list .radio-card{display:flex;font-size:13px;font-weight:500;color:var(--ink);margin-bottom:0}
.modal-field .radio-card b{color:var(--ink);font-weight:650;font-size:13px}
.modal-field .radio-card span{font-size:12px;font-weight:500;color:var(--muted)}
.modal-field .field-help{margin-top:6px}

/* Fırsat 360 · bağlı teklif kayıtları (Teklifler modülünden okunur) */
.slog-teklifler{margin-top:12px;padding-top:12px;border-top:1px solid var(--line)}
.slog-teklif-cap{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
.slog-teklif{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:8px 10px;border:1px solid var(--line);border-radius:8px;margin-bottom:6px;color:var(--ink);text-decoration:none}
.slog-teklif:hover{border-color:var(--brand);background:var(--brand-soft)}
.slog-teklif .st-no{font-size:12.5px;font-weight:650}
.slog-teklif .st-tutar{margin-left:auto;font-size:13px}
.slog-teklif-add{display:inline-block;margin-top:4px;font-size:12.5px;font-weight:600;color:var(--brand)}
/* Belge antedi logosu (A4 belge başlığı): panel logosunun yalnız WEGS
   kelime markası kullanılır — "Müşteri Operasyonları Yönetim Paneli" alt
   yazısı müşteriye giden belgede yer almamalı (kırpma ile). */
.pdf-logo-wrap{display:block;width:98px;height:76px;overflow:hidden;flex-shrink:0}
.pdf-logo{width:200px;height:auto;display:block;margin:-2px 0 0 -2px}

/* ---------- GÖREVLER ("Görevlerim") ---------- */
.gorev-grup{margin-bottom:20px}
.gorev-grup-head{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.gorev-grup-baslik{font-size:13px;font-weight:700;letter-spacing:-.01em}
.gorev-grup-baslik.is-late{color:var(--danger)}
.gorev-grup-head .cnt{background:var(--bg);color:var(--muted);font-size:11px;font-weight:650;min-width:20px;height:20px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;padding:0 6px}
.gorev-grup-not{font-size:12px;font-weight:500;color:var(--muted)}
.gorev-row{display:flex;align-items:center;gap:12px;padding:10px 14px;background:var(--card);border:1px solid var(--line);border-radius:10px;margin-bottom:6px;cursor:pointer}
.gorev-row:hover{border-color:var(--brand);box-shadow:var(--shadow)}
.gorev-row.is-done{opacity:.6}
.gorev-row.is-done .gorev-baslik{text-decoration:line-through}
.gorev-check{flex-shrink:0;display:flex}
.gorev-tik{width:22px;height:22px;border-radius:6px;border:1.5px solid var(--line);background:var(--card);cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0}
.gorev-tik svg{width:14px;height:14px;stroke:transparent;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.gorev-tik:hover{border-color:var(--success)}
.gorev-tik:hover svg{stroke:var(--success)}
.gorev-tik.is-done{background:var(--success);border-color:var(--success)}
.gorev-tik.is-done svg{stroke:#fff}
.gorev-meta{min-width:0;flex:1}
.gorev-baslik{font-size:13.5px;font-weight:600;line-height:1.35}
.gorev-alt{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:4px}
.gorev-kaynak{display:inline-flex;align-items:center;gap:4px;font-size:11.5px;font-weight:500;color:var(--brand);text-decoration:none}
.gorev-kaynak svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round}
.gorev-kaynak:hover{text-decoration:underline}
.gorev-vade{flex-shrink:0;text-align:right;min-width:96px;font-size:12px;font-variant-numeric:tabular-nums}
.gorev-vade b{display:block;font-size:12.5px;font-weight:650}
.gorev-vade span{display:block;font-size:11px;font-weight:500;color:var(--muted)}
.gorev-vade.is-late b,.gorev-vade.is-late span{color:var(--danger)}
.gorev-vade.is-today b{color:var(--brand)}
.gorev-sorumlu{flex-shrink:0;min-width:64px;display:flex;justify-content:flex-end;align-items:center}
.gorev-sorumlu .st-none{font-size:11px;white-space:nowrap}
@media (max-width:767px){
  .gorev-row{flex-wrap:wrap}
  .gorev-meta{flex:1 1 60%}
  .gorev-vade{min-width:0;text-align:left;flex:1 1 100%;order:5}
}

/* Lisans 360 künye şeridi — kritik sayılar tek bakışta */
.lis-hero{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:1px;
  background:var(--line);border:1px solid var(--line);border-radius:12px;overflow:hidden;margin-bottom:16px;
}
.lis-hero-item{background:linear-gradient(180deg,#FFFFFF 0%,#FAFCFE 100%);padding:14px 16px;display:flex;flex-direction:column;gap:4px;min-width:0}
.lis-hero-item .lbl{font-size:11px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
.lis-hero-item .val{font-size:20px;font-weight:750;letter-spacing:-.02em;font-variant-numeric:tabular-nums;line-height:1.15}
.lis-hero-item .val .pay{font-size:13px;font-weight:600;color:var(--muted)}
.lis-hero-item .sub{font-size:11.5px;font-weight:500;color:var(--muted);overflow:hidden;text-overflow:ellipsis}
.lis-hero-item .hbar{margin-top:4px}
.file-row .file-act + .file-act{margin-left:6px}

/* ---------- SAYFA & PENCERE GEÇİŞLERİ ---------- */
/* İçerik girişte yumuşak belirir; sayfalar arası geçiş sert kesilmez. */
/* DİKKAT: .content'e transform'lu animasyon VERİLMEZ — transform, içindeki
   position:fixed öğeler (slide-over, overlay, modal) için yeni bir kapsayıcı
   blok oluşturur ve panelleri ekrana değil içerik kutusuna sabitler.
   Bu yüzden sayfa girişinde yalnız opaklık animasyonu kullanılır; kayma
   efekti fixed öğe içermeyen başlık bloğuna verilir. */
/* DİKKAT: bu animasyon transform İÇERMEZ. transform'u animate eden bir kural,
   animasyon bittikten sonra bile (fill-mode both) elemanı kapsayıcı bağlam
   yapıyor ve içindeki position:fixed öğeleri (satır menüsü, slide-over) ekrana
   değil o kutuya sabitliyor — menüler ekran dışına düşüyordu. Kayma efekti
   yalnız fixed öğe barındırmayan başlık bloklarına verilir (icerik-kay). */
@keyframes icerik-gir{from{opacity:0}to{opacity:1}}
@keyframes icerik-kay{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
/* Animasyon KAPSAYICIYA değil, içindeki bloklara verilir: .content'e verilen
   her animasyon (transform ya da opacity) yeni bir yığın/kapsayıcı bağlamı
   oluşturur; bu da position:fixed panelleri içerik kutusuna hapseder ve
   üst çubuğun altında bırakır. Slide-over/overlay/modal animasyon dışında. */
.content > :not(.slideover):not(.so-overlay):not(.modal-wrap):not(template){
  animation:icerik-gir .22s cubic-bezier(.22,.61,.36,1) both;
}
/* Kayma efekti: içinde fixed öğe (dropdown/panel) bulunmayan başlık blokları. */
.content > .page-head,.content > .cust-header,.content > .back-link,
.content > .kpi-grid,.content > .lis-hero,.content > .tabs{
  animation:icerik-kay .22s cubic-bezier(.22,.61,.36,1) both;
}

/* Üstte ince yükleniyor çubuğu (link/form geçişlerinde) */
.nav-progress{
  position:fixed;top:0;left:0;height:2px;width:0;z-index:200;
  background:linear-gradient(90deg,var(--brand),var(--accent));
  transition:width .25s ease;box-shadow:0 0 8px rgba(35,170,225,.5);
}
.nav-progress.is-on{width:45%}
.nav-progress.is-slow{width:80%;transition:width 1.6s ease}

/* Slide-over: display yerine kayarak açılır/kapanır */
.so-overlay,.slideover{display:flex}
.so-overlay{
  display:block;opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity .2s ease,visibility .2s;
}
.slideover{
  transform:translateX(16px);opacity:0;visibility:hidden;pointer-events:none;
  transition:transform .24s cubic-bezier(.22,.61,.36,1),opacity .2s ease,visibility .24s;
}
/* Mobilde panel ekran genişliğinde: kapalıyken 16px sağa kaydırmak yatay
   taşma üretiyor, mobil düzen görünümü de taşmayı emmek için genişliyordu
   (390px ekranda sayfa 472px'e çıkıyordu). Telefonda 16px'lik kayma zaten
   fark edilmez; panel yalnız görünürlükle açılır. */
@media (max-width:767px){.slideover{transform:none}}
body.so-open .so-overlay{opacity:1;visibility:visible;pointer-events:auto}
/* Yalnız açılan panel görünür. Önce bütün .slideover'lar gösteriliyordu;
   sayfada ikinci bir panel olduğunda (kayıt özeti + e-posta gönder) ikisi
   üst üste biniyor ve DOM'da sonra gelen kazanıyordu. */
body.so-open .slideover[aria-hidden="false"]{transform:none;opacity:1;visibility:visible;pointer-events:auto}
body.so-open{overflow:hidden}

/* Modal: hafif büyüyerek açılır */
.modal-wrap{display:flex;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .18s ease,visibility .18s}
.modal-wrap.open{opacity:1;visibility:visible;pointer-events:auto}
.modal-wrap .modal{transform:translateY(8px) scale(.985);transition:transform .2s cubic-bezier(.22,.61,.36,1)}
.modal-wrap.open .modal{transform:none}

/* Satır/kart etkileşimlerinde yumuşak geçiş */
.gorev-row,.picker-item,.ws-mini,.slog-teklif,.file-row{transition:background .15s ease,border-color .15s ease,box-shadow .15s ease}
tr[data-href],tr[data-lisans-ozet],tr[data-fatura-ozet],tr[data-teklif-ozet],tr[data-kanal-ozet]{transition:background .12s ease}

/* Hareket azaltma tercihi olan kullanıcıda animasyon kapanır */
@media (prefers-reduced-motion: reduce){
  .content{animation:none}
  .so-overlay,.slideover,.modal-wrap,.modal-wrap .modal,.nav-progress{transition:none}
}

/* ---------- PAKET & FİYATLANDIRMA ---------- */
.pk-grup{margin-bottom:24px}
.pk-grup-head{display:flex;align-items:baseline;gap:10px;margin-bottom:10px}
.pk-grup-ad{font-size:15px;font-weight:700;letter-spacing:-.01em}
.pk-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(255px,1fr));gap:14px}
.pk-kart{
  position:relative;display:flex;flex-direction:column;gap:6px;
  background:var(--card);border:1px solid var(--line);border-radius:14px;padding:18px 18px 14px;
  box-shadow:var(--shadow);cursor:pointer;transition:border-color .15s ease,box-shadow .15s ease,transform .15s ease;
}
.pk-kart:hover{border-color:var(--brand);box-shadow:0 8px 22px rgba(15,49,86,.10);transform:translateY(-2px)}
.pk-kart.is-populer{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft),var(--shadow)}
.pk-kart.is-pasif{opacity:.62}
.pk-kart.is-onizleme{cursor:default;box-shadow:none}
.pk-ust{display:flex;align-items:center;gap:6px;flex-wrap:wrap;min-height:22px}
.pk-rozet{
  margin-left:auto;padding:2px 9px;border-radius:999px;font-size:10.5px;font-weight:700;
  letter-spacing:.04em;text-transform:uppercase;background:linear-gradient(135deg,var(--brand),var(--accent));color:#fff;
}
.pk-ad{font-size:17px;font-weight:750;letter-spacing:-.02em;line-height:1.2;margin-top:4px}
.pk-kod{font-size:11.5px;font-weight:500;color:var(--muted)}
.pk-fiyat{display:flex;align-items:baseline;gap:5px;margin-top:8px}
.pk-tutar{font-size:26px;font-weight:750;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.pk-birim{font-size:12.5px;font-weight:500;color:var(--muted)}
.pk-fiyat-alt{font-size:11.5px;font-weight:500;color:var(--muted)}
.pk-fiyat-alt b{color:var(--success);font-weight:650}
.pk-liste{list-style:none;margin:12px 0 0;padding:0;display:flex;flex-direction:column;gap:6px}
.pk-liste li{position:relative;padding-left:20px;font-size:12.5px;font-weight:500;color:var(--ink)}
.pk-liste li::before{
  content:"";position:absolute;left:0;top:5px;width:12px;height:7px;
  border-left:2px solid var(--success);border-bottom:2px solid var(--success);transform:rotate(-45deg);
}
.pk-liste li b{font-weight:700}
.pk-ozellik{margin-top:10px;font-size:11.5px;font-weight:500;color:var(--muted);line-height:1.5}
.pk-alt{display:flex;align-items:center;gap:8px;margin-top:14px;padding-top:12px;border-top:1px solid var(--line)}
.pk-alt .btn{margin-left:auto}
@media (max-width:600px){.pk-grid{grid-template-columns:1fr}}

/* ---- Paket: toplu fiyat güncelleme + planlı fiyat ----------------------- */
/* Seçim kutusu sütunu: yalnız padding-right sıfırlanmıştı, soldaki 16px
   duruyordu. Kutu 16px içeriden başlayıp sağdaki ayırıcı çizgiye yapışıyor,
   çizgi kutuya değiyormuş gibi duruyordu. İki yan da sıfırlandı; min-width
   şart, çünkü geniş tabloda tarayıcı width'i öneri sayıp sütunu kutunun
   kendi genişliğine (16px) kadar daraltıyor ve kutu yine çizgiye yapışıyor. */
.td-tik{width:38px;min-width:38px;text-align:center;padding-left:0;padding-right:0}
.td-tik input{width:15px;height:15px;accent-color:var(--brand);cursor:pointer;vertical-align:middle}
.bulkbar{
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:12px;
  padding:10px 14px;border:1px solid var(--line);border-radius:12px;
  background:var(--brand-soft);
}
.bulkbar[hidden]{display:none}
.bulkbar-n{font-size:13px;font-weight:550;color:var(--ink)}
.bulkbar-n b{font-variant-numeric:tabular-nums}
.bulkbar-sp{flex:1}
.pk-plan{
  display:flex;align-items:center;gap:7px;margin-top:8px;padding:7px 10px;border-radius:9px;
  background:var(--warning-soft);color:var(--warning);
  font-size:11.5px;font-weight:500;line-height:1.4;
}
.pk-plan svg{width:14px;height:14px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round}
.pk-plan b{font-weight:650}
.pk-plan-mini{color:var(--warning)!important;font-weight:550}
.modal-note{
  margin-top:14px;padding:10px 12px;border-radius:10px;background:var(--bg);
  border:1px solid var(--line);font-size:12.5px;color:var(--muted);line-height:1.6;
}
.modal-note b{color:var(--ink);font-weight:600}
.modal-note + .modal-grid,.modal-note + .modal-field{margin-top:14px}
.modal-note.is-warn{background:var(--warning-soft);border-color:#F2DCB8;color:var(--warning)}
.modal-note[hidden]{display:none}
.field-hint{display:block;margin-top:5px;font-size:11.5px;color:var(--muted);line-height:1.5}
.so-stat .st-sub{display:block;margin-top:4px;font-size:11px;font-weight:500;color:var(--muted);line-height:1.5}

/* Fiyat listesi tablosu: paket adı kolonu daralınca kelimeler ortadan
   kırılıyordu ("Başlan gıç"); bu tabloda kırma yalnız gerçekten uzun
   kelimelerde devreye girsin. */
.pdf-table.pk-liste-table td,.pdf-table.pk-liste-table th{overflow-wrap:break-word}
.pdf-table.pk-liste-table th:first-child,.pdf-table.pk-liste-table td:first-child{min-width:170px}
.pdf-table.pk-liste-table .li-name{white-space:nowrap}
.filter-chips{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.filter-chips .chip-filter{text-decoration:none}
@media print{.filter-chips{display:none!important}}
.slog-field .val-kaynak{display:block;margin-top:2px;font-size:11px;font-weight:500;color:var(--muted)}

/* Yüzde/birim ekli input (İndirim yetkileri) */
.input-suffix{position:relative;display:block}
.input-suffix .input{padding-right:30px}
.input-suffix span{
  position:absolute;right:11px;top:50%;transform:translateY(-50%);
  font-size:12.5px;font-weight:600;color:var(--muted);pointer-events:none;
}
.limit-kaynak{margin-top:6px;font-size:11.5px;font-weight:500;color:var(--muted);line-height:1.5}
.limit-kaynak b{color:var(--ink);font-weight:650}
/* Kullanıcı ↔ personel eşleştirme satırı */
.es-form{display:flex;gap:6px;align-items:center;margin:0}
.es-form .select{height:32px;padding:4px 26px 4px 10px;font-size:12.5px;min-width:140px}

/* Satır aksiyon menüsü: içerikten net ayrılsın, hangi satıra ait olduğu belli
   olsun. Menü viewport'a sabitlendiği için kaydırmada JS ile kapatılır. */
.dropdown{
  box-shadow:0 4px 6px -2px rgba(15,49,86,.06), 0 12px 28px -6px rgba(15,49,86,.22);
  z-index:60;
}
tbody tr.row-menu-acik{background:var(--brand-soft)}
tbody tr.row-menu-acik td:first-child{box-shadow:inset 3px 0 0 var(--brand)}
/* mini-table'da ilk hücrenin sol dolgusu yok: iç gölge çizgisi metnin üstüne
   biniyordu. Orada vurgu yalnız zemin rengiyle yapılır. */
.mini-table tbody tr.row-menu-acik td:first-child{box-shadow:none}
.row-menu.open .row-action{background:var(--brand-soft);color:var(--brand)}
/* Menü açık satır: içerik kalabalığında menünün hangi kayda ait olduğu
   kaybolmasın diye satır vurgulanır ve menü kenarı belirginleştirilir. */
.row-menu.open .dropdown{border-color:#CBD8E8}

/* ============================================================
   ONBOARDING — kurulum süreci
   Adım listesi zaman çizelgesi gibi okunur: solda numara ve
   bağlantı çizgisi, sağda içerik ve aksiyonlar.
   ============================================================ */
.prog-wrap{margin:0 0 16px}
.prog-bar{height:8px;border-radius:99px;background:var(--line);overflow:hidden}
.prog-bar i{display:block;height:100%;border-radius:99px;transition:width .3s ease}
.prog-bar i.p-brand{background:linear-gradient(90deg,var(--brand),var(--accent))}
.prog-bar i.p-success{background:var(--success)}
.prog-bar i.p-danger{background:var(--danger)}

.onb-adimlar{display:flex;flex-direction:column}
.onb-adim{display:flex;gap:14px;padding:0}
.onb-adim .oa-sol{display:flex;flex-direction:column;align-items:center;width:30px;flex-shrink:0}
.onb-adim .oa-no{
  width:26px;height:26px;border-radius:50%;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  font-size:12px;font-weight:700;background:var(--bg);color:var(--muted);
  border:1.5px solid var(--line);
}
.onb-adim .oa-line{flex:1;width:2px;background:var(--line);margin:4px 0}
.onb-adim:last-child .oa-line{display:none}
.onb-adim.is-done .oa-no{background:var(--success-soft);border-color:var(--success);color:var(--success)}
.onb-adim.is-done .oa-line{background:var(--success-soft)}
.onb-adim.is-current .oa-no{background:var(--brand);border-color:var(--brand);color:#fff;box-shadow:0 0 0 4px var(--brand-soft)}
.onb-adim.is-late .oa-no{background:var(--danger-soft);border-color:var(--danger);color:var(--danger)}
.onb-adim .oa-govde{flex:1;min-width:0;padding:0 0 18px}
.onb-adim.is-current .oa-govde{background:var(--brand-soft);border-radius:10px;padding:12px 14px;margin-bottom:14px}
.onb-adim .oa-ust{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;align-items:flex-start}
.onb-adim .oa-baslik{font-size:13.5px;font-weight:650;color:var(--ink);display:flex;align-items:center;gap:8px;flex-wrap:wrap;line-height:1.4}
.onb-adim.is-done .oa-baslik{color:var(--muted);text-decoration:line-through;text-decoration-color:var(--line)}
.onb-adim .oa-etiket{display:flex;gap:6px;flex-wrap:wrap}
.onb-adim .oa-aciklama{font-size:12.5px;font-weight:500;color:var(--muted);line-height:1.6;margin-top:4px}
.onb-adim .oa-not{
  margin-top:8px;padding:8px 10px;border-radius:8px;background:var(--bg);
  font-size:12px;font-weight:500;color:var(--muted);line-height:1.5;
}
.onb-adim .oa-not b{color:var(--ink);font-weight:650}
.onb-adim .oa-tamam{margin-top:6px;font-size:11.5px;font-weight:600;color:var(--success)}
.onb-adim .oa-aksiyon{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.onb-adim.is-done .oa-aksiyon{opacity:.65}
.onb-adim.is-done:hover .oa-aksiyon{opacity:1}

.chip-warn{background:var(--warning-soft);color:var(--warning)}
.chip-danger{background:var(--danger-soft);color:var(--danger)}
.chip-link{text-decoration:none;background:var(--brand-soft);color:var(--brand)}

/* Şablon kartları */
.onb-sablonlar{display:grid;grid-template-columns:repeat(auto-fit,minmax(420px,1fr));gap:16px}
.onb-sablon.is-pasif{opacity:.7}
.onb-sablon-adim{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.onb-sablon-adim li{
  display:flex;align-items:flex-start;gap:10px;padding:8px 10px;border-radius:9px;background:var(--bg);
}
.onb-sablon-adim .oa-ix{
  width:22px;height:22px;border-radius:50%;background:var(--card);border:1px solid var(--line);
  display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;color:var(--muted);flex-shrink:0;
}
.onb-sablon-adim .oa-ad{flex:1;min-width:0;font-size:12.5px;font-weight:600;color:var(--ink);line-height:1.45}
.onb-sablon-adim .oa-meta{display:flex;gap:5px;flex-wrap:wrap}
.onb-sablon-alt{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap;align-items:center}

/* Adım satırı iki katman: üstte başlık + işlemler, altta açıklama ve etiketler.
   Hepsi tek satırdayken (numara + başlık + 3 etiket + 4 düğme) iki kolonlu
   kart genişliğinde başlık üç satıra kırılıyordu. */
.onb-sablon-adim .oa-govde{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.onb-sablon-adim .oa-ust{display:flex;align-items:flex-start;gap:8px}
.onb-sablon-adim .oa-not{margin:0;font-size:11.5px;color:var(--muted);line-height:1.45}
.onb-sablon-adim .oa-islem{display:flex;align-items:center;gap:1px;flex-shrink:0;margin-top:-2px}
.onb-sablon-adim .oa-tasi,.onb-sablon-adim .oa-sil{display:flex;margin:0}
.btn-ikon{padding:4px 5px;min-width:0;line-height:0;color:var(--muted)}
.btn-ikon svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.btn-ikon:hover{color:var(--brand);background:var(--bg-hover,rgba(18,116,197,.08))}
.btn-ikon:disabled{opacity:.28;cursor:default}
.btn-ikon:disabled:hover{color:var(--muted);background:transparent}
.btn-ikon.btn-tehlike:hover{color:var(--danger);background:rgba(220,38,38,.09)}
.onb-sablon-adim .oa-bos{background:transparent;border:1px dashed var(--line)}
.onb-sablon-adim .oa-bos .oa-ad{font-weight:500;color:var(--muted)}

/* Şablonu hangi ürün politikası varsayılan kabul ediyor. Silme/pasife alma
   kararı buna bakıyor, bu yüzden kartın üstünde duruyor. */
.sablon-bag{
  display:flex;align-items:flex-start;gap:7px;margin:0 0 10px;padding:7px 10px;
  border-radius:9px;background:var(--bg);font-size:12px;color:var(--ink);line-height:1.45;
}
.sablon-bag svg{width:15px;height:15px;flex-shrink:0;margin-top:1px;fill:none;stroke:var(--brand);stroke-width:1.5}
.sablon-bag b{font-weight:650}
.sablon-silinmez{font-size:11.5px;color:var(--muted)}

/* Paket kartında cihaz kimliği: marka ve model. Paket adı ticari bir ad
   olabildiği için hangi cihaz olduğunu asıl bu satır söylüyor. */
.pk-cihaz{
  display:flex;align-items:center;gap:7px;margin:-2px 0 8px;
  font-size:12.5px;color:var(--ink);line-height:1.4;
}
.pk-cihaz svg{width:15px;height:15px;flex-shrink:0;fill:none;stroke:var(--brand);
  stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
.pk-cihaz b{font-weight:650}

/* Künye modalı: ürün çoklu seçimi */
.sk-urun-tum{
  display:flex;align-items:center;gap:8px;padding:8px 10px;margin-bottom:8px;
  border:1px solid var(--line);border-radius:9px;background:var(--bg);
  font-size:12.5px;cursor:pointer;
}
.sk-urun-tum .cell-sub{margin-left:auto}
.sk-urunler{display:grid;grid-template-columns:repeat(auto-fill,minmax(148px,1fr));gap:6px}
.sk-urun{
  display:flex;align-items:center;gap:7px;padding:7px 9px;border:1px solid var(--line);
  border-radius:8px;font-size:12.5px;cursor:pointer;
}
.sk-urun:hover{border-color:var(--brand)}
.sk-urun input:checked+*,.sk-urun:has(input:checked){border-color:var(--brand);background:rgba(18,116,197,.06)}

/* Slide-over adım listesi */
.onb-so-adim{display:flex;flex-direction:column;gap:8px}
.onb-so-row{display:flex;align-items:center;gap:10px;padding:8px 10px;border:1px solid var(--line);border-radius:9px}
.onb-so-meta{flex:1;min-width:0;font-size:12.5px;line-height:1.4}
.onb-so-meta b{font-weight:600;display:block}
.onb-so-row .oi{width:9px;height:9px;border-radius:50%;flex-shrink:0}
.onb-so-row .oi-done{background:var(--success)}
.onb-so-row .oi-open{background:var(--brand)}
.onb-so-row .oi-late{background:var(--danger)}

@media (max-width:900px){
  .onb-sablonlar{grid-template-columns:1fr}
}
/* Onboarding listesi: ilerleme çubuğu okunur genişlikte olsun */
td .seat .hbar{min-width:110px}

/* Müşteri kurulum özeti (yazdırılabilir belge) */
.mz-ozet{margin-top:22px;padding:16px 18px;border:1px solid var(--line);border-radius:12px;background:var(--bg)}
.mz-ilerleme{display:flex;align-items:center;gap:16px}
.mz-yuzde{font-size:34px;font-weight:750;letter-spacing:-.02em;color:var(--brand);line-height:1}
.mz-meta{display:flex;flex-direction:column;gap:2px;font-size:12.5px;color:var(--muted)}
.mz-meta b{font-size:13.5px;font-weight:650;color:var(--ink)}
.mz-blok{margin-top:20px}
.mz-blok.mz-vurgu{padding:14px 16px;border:1px solid #F2DCB8;border-radius:12px;background:var(--warning-soft)}
.mz-blok-bas{display:flex;gap:10px;align-items:flex-start;margin-bottom:10px}
.mz-blok-bas b{display:block;font-size:13.5px;font-weight:700;color:var(--ink)}
.mz-blok-bas span{display:block;font-size:12px;font-weight:500;color:var(--muted);margin-top:1px}
.mz-ikon{
  width:24px;height:24px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;
  font-size:12px;font-weight:700;color:#fff;
}
.mz-i-warn{background:var(--warning)}
.mz-i-brand{background:var(--brand)}
.mz-i-ok{background:var(--success)}
.mz-liste{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.mz-liste li{display:flex;align-items:flex-start;gap:10px;padding:8px 10px;border-radius:9px;background:var(--card);border:1px solid var(--line)}
.mz-liste li > div{flex:1;min-width:0}
.mz-liste b{font-size:12.5px;font-weight:600;color:var(--ink);display:block;line-height:1.45}
.mz-liste span:not(.mz-nokta):not(.mz-vade){display:block;font-size:11.5px;font-weight:500;color:var(--muted);margin-top:1px;line-height:1.5}
.mz-nokta{width:8px;height:8px;border-radius:50%;flex-shrink:0;margin-top:5px}
.mz-n-warn{background:var(--warning)}
.mz-n-brand{background:var(--brand)}
.mz-n-ok{background:var(--success)}
.mz-vade{flex-shrink:0;font-size:11.5px;font-weight:600;color:var(--muted);white-space:nowrap}
.mz-vade.is-late{color:var(--danger)}
.mz-liste.is-done b{color:var(--muted);font-weight:500}
/* Şablon karnesi */
.sablon-perf{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:0 0 12px}
.sablon-perf .sp-kutu{padding:8px 10px;border:1px solid var(--line);border-radius:9px;background:var(--bg)}
.sablon-perf .sp-genis{grid-column:1 / -1}
.sablon-perf .lbl{display:block;font-size:11px;font-weight:500;color:var(--muted)}
.sablon-perf .val{display:block;font-size:16px;font-weight:700;color:var(--ink);line-height:1.3;margin-top:1px}
.sablon-perf .sub{display:block;font-size:11px;font-weight:500;color:var(--muted);margin-top:1px}
/* Notlar listesinde cümle içi vurgu satır kırmasın (blok kuralı yalnız başlık için). */
.pdf-terms li b{display:inline;font-size:inherit;letter-spacing:normal;text-transform:none;margin:0;color:var(--ink)}
/* Boş kurulum kartı: şablonlardan görsel olarak ayrılsın */
.pick-card.pk-bos{border-style:dashed}
.pick-card.pk-bos .pick-price{color:var(--muted)}

/* Onboarding slide-over: adım odaklı panel */
.so-sec-not{font-size:11px;font-weight:500;color:var(--muted);margin-left:6px;text-transform:none;letter-spacing:0}
.onb-so-ilerleme{padding:12px 14px;border:1px solid var(--line);border-radius:11px;background:var(--bg)}
.onb-so-ilerleme .oi-ust{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:8px}
.onb-so-ilerleme .oi-ust b{font-size:14px;font-weight:700;color:var(--ink)}
.onb-so-ilerleme .oi-ust span{font-size:13px;font-weight:650;color:var(--brand)}
.onb-so-ilerleme .oi-alt{margin-top:8px;font-size:11.5px;font-weight:500;color:var(--muted)}
.oss-kart{padding:12px 14px;border:1px solid var(--brand);border-radius:11px;background:var(--brand-soft)}
.oss-kart.is-musteri{border-color:#F2DCB8;background:var(--warning-soft)}
.oss-kart.is-late{border-color:var(--danger)}
.oss-ust{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}
.oss-ust b{font-size:13.5px;font-weight:650;color:var(--ink);line-height:1.4}
.oss-aciklama{margin-top:5px;font-size:12px;font-weight:500;color:var(--muted);line-height:1.5}
.oss-alt{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:10px}
.oss-vade{font-size:11.5px;font-weight:600;color:var(--muted)}
.oss-vade.is-late{color:var(--danger)}
.oss-ops{font-size:10.5px;font-weight:600;color:var(--muted)}
.oss-ok{font-size:13px;font-weight:700;color:var(--success);flex-shrink:0}
.oss-hizli{margin:0;flex-shrink:0}
.btn-icon-sm{width:28px;height:28px;border-radius:8px}
.onb-so-row.is-done{opacity:.62}
.onb-so-row.is-done b{font-weight:500;color:var(--muted)}
.onb-so-row .oi-musteri{background:var(--warning)}
/* Deneme hesabı: self-servis kapalı ürün kartı */
.pick-card.pk-kapali{opacity:.85}
.pick-card.pk-kapali .pick-name{color:var(--muted)}
.es-liste{list-style:none;margin:6px 0;padding:0;display:flex;flex-direction:column;gap:4px}
.es-liste a{font-weight:600}
/* Self-servis: API sözleşmesi ve anahtar gösterimi */
.anahtar-kod{display:block;margin:6px 0;padding:8px 10px;border-radius:8px;background:var(--card);border:1px solid var(--line);font-family:ui-monospace,Menlo,monospace;font-size:12.5px;word-break:break-all}
.api-doc{font-size:12.5px;line-height:1.6}
.api-doc b{display:block;margin:10px 0 4px;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.api-doc code{display:inline-block;padding:3px 8px;border-radius:6px;background:var(--brand-soft);color:var(--brand);font-family:ui-monospace,Menlo,monospace;font-size:12px;margin-bottom:4px}
.api-doc pre{margin:4px 0 8px;padding:10px 12px;border-radius:9px;background:var(--bg);border:1px solid var(--line);font-family:ui-monospace,Menlo,monospace;font-size:11.5px;line-height:1.55;overflow-x:auto;color:var(--ink)}

/* ============================================================
   DESTEK TALEPLERİ
   Konuşma akışı: müşteri mesajı solda nötr, ekip yanıtı marka
   renginde, iç not sarı — müşteriye giden ile içerde kalan
   birbirine karışmasın.
   ============================================================ */
.sla-satir{display:block;font-size:11.5px;font-weight:500;color:var(--muted);line-height:1.6}
.sla-satir b{color:var(--ink);font-weight:650}
.sla-satir.is-late{color:var(--danger)}
.sla-satir.is-late b{color:var(--danger)}
tbody tr.row-risk td:first-child{box-shadow:inset 3px 0 0 var(--danger);padding-left:11px}

.dsk-mesaj{padding:12px 14px;border-radius:12px;margin-bottom:10px;border:1px solid var(--line)}
.dsk-mesaj.is-musteri{background:var(--bg);border-color:var(--line)}
.dsk-mesaj.is-ekip{background:var(--brand-soft);border-color:#CBE0F5}
.dsk-mesaj.is-icnot{background:var(--warning-soft);border-color:#F2DCB8}
.dm-ust{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:6px;flex-wrap:wrap}
.dm-kim{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:650;color:var(--ink)}
.dm-zaman{font-size:11.5px;font-weight:500;color:var(--muted)}
.dm-metin{font-size:13px;font-weight:500;color:var(--ink);line-height:1.65;white-space:pre-wrap}

.dsk-yanit{margin-top:16px;border-top:1px solid var(--line);padding-top:14px}
.dy-sekme{display:flex;gap:6px;align-items:center;margin-bottom:10px;flex-wrap:wrap}
.dy-tab{
  padding:6px 12px;border-radius:99px;border:1px solid var(--line);background:var(--card);
  font-size:12.5px;font-weight:600;color:var(--muted);cursor:pointer;transition:all .15s;
}
.dy-tab:hover{border-color:var(--brand);color:var(--brand)}
.dy-tab.is-active{background:var(--brand);border-color:var(--brand);color:#fff}
.dy-alt{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:10px;flex-wrap:wrap}

.dsk-cozum{padding:12px 14px;border-radius:11px;background:var(--success-soft);font-size:13px;line-height:1.65;white-space:pre-wrap;color:var(--ink)}
.dsk-memnuniyet{display:flex;align-items:center;gap:12px;margin-top:12px;padding:10px 12px;border:1px solid var(--line);border-radius:11px}
.dm-puan{font-size:22px;font-weight:750;color:var(--success);letter-spacing:-.02em}
.dsk-memnuniyet b{font-size:13px;font-weight:650;display:block}

/* Slide-over mesaj listesi */
.dsk-so-mesaj{display:flex;flex-direction:column;gap:8px}
.dsk-so-satir{padding:9px 11px;border-radius:10px;border:1px solid var(--line)}
.dsk-so-satir.is-ekip{background:var(--brand-soft);border-color:#CBE0F5}
.dsk-so-satir.is-icnot{background:var(--warning-soft);border-color:#F2DCB8}
.dss-ust{display:flex;justify-content:space-between;gap:8px;margin-bottom:3px}
.dss-ust b{font-size:12px;font-weight:650}
.dss-ust span{font-size:11px;color:var(--muted)}
.dss-metin{font-size:12.5px;line-height:1.55;color:var(--ink);white-space:pre-wrap;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.so-aciklama{font-size:12.5px;line-height:1.65;color:var(--ink);white-space:pre-wrap;
  padding:10px 12px;border-radius:10px;background:var(--bg);border:1px solid var(--line)}

/* Hazır yanıt satırı */
.hy-satir{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--line)}
/* İlk ve son satırın dış boşluğu gövde dolgusuna ekleniyordu: liste başlıkla
   ve alttaki çizgiyle gereğinden uzak duruyordu. */
.tc-govde > .hy-satir:first-of-type{padding-top:2px}
.hy-satir:last-of-type{border-bottom:0;padding-bottom:2px}
.hy-satir.is-pasif{opacity:.6}
.hy-meta b{font-size:13px;font-weight:650;display:block}
.hy-aksiyon{display:flex;gap:4px;flex-shrink:0}
/* "Yeni hazır yanıt" başlığı: form bölümünün listenin devamı değil, ayrı bir
   iş olduğunu söylüyor. */
.hy-form-baslik{font-size:12px;font-weight:650;color:var(--ink);margin-bottom:10px}
.monogram.mg-danger{background:var(--danger)}
.monogram.mg-warning{background:var(--warning)}
.tk-teknik{margin-top:10px;padding:9px 11px;border-radius:9px;background:var(--bg);border:1px solid var(--line);font-size:12px;line-height:1.6;color:var(--muted);white-space:pre-wrap;font-family:ui-monospace,Menlo,monospace}
.tk-teknik b{display:block;font-family:Inter,sans-serif;font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--ink);margin-bottom:4px}

/* ---- Müşteri Başarı ---------------------------------------------------- */
.mb-skor{display:flex;align-items:center;gap:14px;padding:12px 14px;border:1px solid var(--line);border-radius:11px;background:var(--bg)}
.mbs-sayi{font-size:30px;font-weight:750;letter-spacing:-.02em;color:var(--brand);line-height:1}
.mbs-sayi span{font-size:14px;font-weight:600;color:var(--muted)}
.mbs-meta b{display:block;font-size:13px;font-weight:650;color:var(--ink)}
.mbs-meta span{display:block;font-size:11.5px;color:var(--muted);margin-top:2px;line-height:1.5}
.mb-bilesen{display:flex;flex-direction:column;gap:8px}
.mbb{display:flex;align-items:center;gap:10px}
.mbb .lbl{width:92px;flex-shrink:0;font-size:12px;font-weight:500;color:var(--muted)}
.mbb .hbar{flex:1;min-width:60px}
.mbb .val{width:52px;text-align:right;font-size:12.5px;font-weight:650;color:var(--ink);font-variant-numeric:tabular-nums}
.mbb .val span{font-size:11px;font-weight:500;color:var(--muted)}
.mb-temas{padding:11px 13px;border:1px solid var(--line);border-radius:11px;margin-bottom:9px}
.mt-ust{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:6px}
.mt-tarih{font-size:11.5px;font-weight:500;color:var(--muted)}
.mt-ozet{font-size:13px;line-height:1.6;color:var(--ink);white-space:pre-wrap}
.mt-satir{margin-top:5px;font-size:12px;color:var(--muted);line-height:1.55}
.mt-satir b{color:var(--ink);font-weight:650}
.hbar i.h-warning{background:var(--warning)}

/* ---- Dashboard ---------------------------------------------------------- */
.dash-aksiyon{display:flex;flex-direction:column;gap:8px}
.da-satir{
  display:flex;align-items:center;gap:12px;padding:11px 13px;border-radius:11px;
  border:1px solid var(--line);background:var(--card);text-decoration:none;transition:all .15s;
}
.da-satir:hover{border-color:var(--brand);background:var(--brand-soft);transform:translateX(2px)}
.da-adet{
  min-width:34px;height:34px;padding:0 6px;border-radius:9px;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  font-size:15px;font-weight:750;color:#fff;background:var(--muted);
}
.da-satir.is-kritik .da-adet{background:var(--danger)}
.da-satir.is-uyari .da-adet{background:var(--warning)}
.da-satir.is-bilgi .da-adet{background:var(--brand)}
.da-meta{flex:1;min-width:0}
.da-meta b{display:block;font-size:13.5px;font-weight:650;color:var(--ink);line-height:1.35}
.da-meta span{display:block;font-size:12px;font-weight:500;color:var(--muted);margin-top:2px;line-height:1.45}
.da-ok{width:16px;height:16px;flex-shrink:0;fill:none;stroke:var(--muted);stroke-width:1.6;stroke-linecap:round}
.da-satir:hover .da-ok{stroke:var(--brand)}

.dash-huni{display:flex;flex-direction:column;gap:9px}
/* Eski çubuklu dağılım satırının (flex + sabit 110px/96px sütunlar) kuralları
   kaldırıldı: .dh-bar / .dh-adet artık hiçbir şablonda yok, satır aşağıdaki
   GRID kuralıyla çiziliyor. Ölü kuraldan geriye kalan width:110px grid
   sütununda da geçerli oluyordu: 1280px'te ad sütunu 110px'in altına düşünce
   etiket kendi sütunundan taşıp değerin ÜSTÜNE biniyordu ("Go" ile "₺16.908"
   üst üste). Genişlikler sütun tanımına bırakıldı (kullanıcı tespiti, 18 Eyl 2026).
   .dh-deger'in text-align:right değeri korunuyor: sayı sütunu sağa hizalı okunur. */
.dh-deger{text-align:right;color:var(--ink)}

.dash-urun{margin-bottom:12px}
.du-ust{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:5px}
.du-ust b{font-size:13px;font-weight:650}
.du-ust span{font-size:13px;font-weight:700;color:var(--brand);font-variant-numeric:tabular-nums}
.du-alt{margin-top:4px;font-size:11.5px;color:var(--muted)}

.dash-saglik{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.ds-kutu{padding:10px 8px;border-radius:10px;text-align:center;border:1px solid var(--line)}
.ds-kutu.is-iyi{background:var(--success-soft);border-color:#BFE6D2}
.ds-kutu.is-izleme{background:var(--brand-soft);border-color:#CBE0F5}
.ds-kutu.is-riskli{background:var(--warning-soft);border-color:#F2DCB8}
.ds-kutu.is-kritik{background:var(--danger-soft);border-color:#F5C9CD}
.ds-adet{display:block;font-size:22px;font-weight:750;letter-spacing:-.02em;line-height:1}
.ds-ad{display:block;font-size:11px;font-weight:600;color:var(--muted);margin-top:3px}

/* ---- Finans: yaşlandırma ve performans ---------------------------------- */
.fin-yas{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px}
.fy-kova{padding:12px 13px;border:1px solid var(--line);border-radius:11px;background:var(--card)}
.fy-kova.is-uyari{border-color:#F2DCB8;background:var(--warning-soft)}
.fy-kova.is-kritik{border-color:#F5C9CD;background:var(--danger-soft)}
.fy-ust{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.fy-ad{font-size:12px;font-weight:600;color:var(--muted)}
.fy-adet{font-size:11px;color:var(--muted)}
.fy-tutar{font-size:19px;font-weight:750;letter-spacing:-.02em;margin:4px 0 6px;font-variant-numeric:tabular-nums}
.fy-pay{margin-top:4px;font-size:11px;font-weight:600;color:var(--muted)}
.fin-perf{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;margin-top:14px}
.fp-kutu{padding:11px 13px;border:1px solid var(--line);border-radius:11px}
.fp-kutu .lbl{display:block;font-size:11.5px;font-weight:500;color:var(--muted)}
.fp-kutu .val{display:block;font-size:19px;font-weight:750;letter-spacing:-.02em;margin-top:2px;font-variant-numeric:tabular-nums}
.fp-kutu .sub{display:block;font-size:11px;color:var(--muted);margin-top:3px}
/* Hesap ekstresi */
.ek-musteri{display:flex;justify-content:space-between;gap:20px;margin-top:22px;padding:14px 16px;border:1px solid var(--line);border-radius:11px;background:var(--bg);flex-wrap:wrap}
.ek-musteri b{font-size:14px;font-weight:700;display:block}
.ek-musteri span{font-size:12px;color:var(--muted);line-height:1.6}
.ek-ozet{display:grid;grid-template-columns:auto auto;gap:2px 14px;align-items:baseline}
.ek-ozet .lbl{font-size:11.5px;color:var(--muted)}
.ek-ozet .val{font-size:15px;font-weight:700;text-align:right;font-variant-numeric:tabular-nums}

/* ============================================================
   DASHBOARD — ekip panoları
   ============================================================ */
.dash-ust{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-bottom:16px}
.dash-donem{display:flex;gap:4px;padding:3px;border-radius:10px;background:var(--bg);border:1px solid var(--line)}
.dd-btn{padding:6px 14px;border-radius:8px;font-size:12.5px;font-weight:600;color:var(--muted);text-decoration:none;transition:all .15s}
.dd-btn:hover{color:var(--brand)}
.dd-btn.is-on{background:var(--card);color:var(--ink);box-shadow:var(--shadow)}

.dash-sekme{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px;margin-bottom:18px}
.ds-tab{
  display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:12px;
  border:1px solid var(--line);background:var(--card);text-decoration:none;transition:all .18s;
}
.ds-tab:hover{border-color:var(--brand);transform:translateY(-1px);box-shadow:var(--shadow)}
.ds-tab.is-on{border-color:var(--brand);background:linear-gradient(135deg,var(--brand-soft),var(--card))}
.ds-tab.is-on::after{content:"";position:absolute}
.ds-ikon{
  width:26px;height:26px;border-radius:7px;flex-shrink:0;background:var(--brand-soft);
  display:flex;align-items:center;justify-content:center;
}
.ds-ikon svg{width:15px;height:15px;fill:none;stroke:var(--brand);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.ds-tab.is-on .ds-ikon{background:var(--brand)}
.ds-tab.is-on .ds-ikon svg{stroke:#fff}
/* Her pano kendi rengiyle ayrışır: göz sekmeleri renkten tanır. */
.ds-ikon.ds-satis{background:var(--accent-soft)} .ds-ikon.ds-satis svg{stroke:var(--accent)}
.ds-ikon.ds-musteri{background:var(--success-soft)} .ds-ikon.ds-musteri svg{stroke:var(--success)}
.ds-ikon.ds-destek{background:var(--warning-soft)} .ds-ikon.ds-destek svg{stroke:var(--warning)}
.ds-ikon.ds-finans{background:var(--purple-soft)} .ds-ikon.ds-finans svg{stroke:var(--purple)}
.ds-ikon.ds-teknik{background:var(--danger-soft)} .ds-ikon.ds-teknik svg{stroke:var(--danger)}
.ds-meta{min-width:0}
.ds-meta b{display:block;font-size:13.5px;font-weight:650;color:var(--ink);line-height:1.3}
.ds-meta span{display:block;font-size:11px;font-weight:500;color:var(--muted);margin-top:2px;line-height:1.4;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.dash-seri{display:flex;align-items:flex-end;gap:10px;height:170px;padding:8px 0}
.dsr-sutun{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;height:100%}
.dsr-bar{flex:1;width:100%;display:flex;align-items:flex-end;justify-content:center;position:relative}
.dsr-bar i{display:block;width:100%;max-width:52px;border-radius:8px 8px 0 0;
  background:linear-gradient(180deg,var(--accent),var(--brand));transition:height .3s}
.dsr-deger{text-align:center;font-size:10.5px;font-weight:650;color:var(--muted);
  white-space:nowrap;font-variant-numeric:tabular-nums;margin-bottom:4px}
.dsr-etiket{font-size:11.5px;font-weight:600;color:var(--muted)}

.dash-bar{display:flex;flex-direction:column;gap:9px}
.db-satir{display:flex;align-items:center;gap:10px}
.db-ad{width:120px;flex-shrink:0;font-size:12.5px;font-weight:600;color:var(--ink)}
.db-cubuk{flex:1;height:22px;border-radius:6px;background:var(--bg);overflow:hidden}
.db-cubuk i{display:block;height:100%;border-radius:6px;transition:width .3s}
.db-cubuk i.c-brand{background:var(--brand)} .db-cubuk i.c-accent{background:var(--accent)}
.db-cubuk i.c-purple{background:var(--purple)} .db-cubuk i.c-success{background:var(--success)}
.db-cubuk i.c-warning{background:var(--warning)} .db-cubuk i.c-danger{background:var(--danger)}
.db-deger{width:104px;text-align:right;flex-shrink:0;display:flex;flex-direction:column;line-height:1.25}
.db-deger b{font-size:12.5px;font-weight:650;font-variant-numeric:tabular-nums}
.db-deger i{font-style:normal;font-size:11px;color:var(--muted);font-variant-numeric:tabular-nums}

.dash-liste{display:flex;flex-direction:column;gap:7px}
.dl-satir{
  display:flex;justify-content:space-between;align-items:center;gap:12px;
  padding:10px 12px;border-radius:10px;border:1px solid var(--line);
  background:var(--card);text-decoration:none;transition:all .15s;
}
.dl-satir:hover{border-color:var(--brand);background:var(--brand-soft)}
.dl-satir.is-kritik{border-left:3px solid var(--danger)}
.dl-satir.is-uyari{border-left:3px solid var(--warning)}
.dl-satir.is-bilgi{border-left:3px solid var(--brand)}
.dl-meta{min-width:0;flex:1}
.dl-meta b{display:block;font-size:13px;font-weight:650;color:var(--ink);line-height:1.35;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dl-meta span{display:block;font-size:11.5px;color:var(--muted);margin-top:2px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dl-sag{text-align:right;flex-shrink:0}
.dl-sag b{display:block;font-size:13px;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums}
.dl-sag span{display:block;font-size:11px;color:var(--muted);margin-top:1px}
@media (max-width:900px){
  .dash-sekme{grid-template-columns:repeat(2,1fr)}
  .db-ad{width:90px}
}
.de-tik{width:16px;height:16px;accent-color:var(--brand);cursor:pointer}
.de-tik:disabled{opacity:.5;cursor:not-allowed}
.mini-table form{display:contents}


/* --- Yeni Workspace · ürün ve paket satırları ------------------------------ */
/* Satırlar katalogdan seçilir; liste ve net fiyat okunur alan olduğu için
   input değil metin olarak gösterilir — elle yazılamayacağı görünsün. */
.line-items .li-not{margin-top:6px;font-size:11.5px;color:var(--muted);line-height:1.4}
.line-items .li-not.is-warn{color:var(--danger);font-weight:600}
.line-items .li-liste,.line-items .li-net{
  display:inline-block;font-size:13px;font-variant-numeric:tabular-nums;color:var(--ink)}
.line-items .li-liste{color:var(--muted)}
.line-items .li-net{font-weight:650}
.line-items input.is-invalid{border-color:var(--danger);background:var(--danger-soft)}
.ws-teklif{display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  padding:12px 14px;margin-bottom:14px;border:1px solid var(--brand-soft);
  border-radius:10px;background:var(--brand-soft)}
.ws-teklif>svg{width:20px;height:20px;flex-shrink:0;fill:none;stroke:var(--brand);
  stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.ws-teklif-meta{flex:1;min-width:220px;display:flex;flex-direction:column;gap:2px}
.ws-teklif-meta b{font-size:13px;color:var(--ink)}
.ws-teklif-meta span{font-size:12px;color:var(--muted)}


/* --- Profil · iki adımlı doğrulama kurulumu -------------------------------- */
.tfa-kur{display:flex;flex-direction:column;gap:18px;max-width:560px}
.tfa-adim{display:flex;gap:12px;align-items:flex-start}
.tfa-no{flex-shrink:0;width:24px;height:24px;border-radius:50%;background:var(--brand);color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700}
.tfa-adim>div{display:flex;flex-direction:column;gap:4px}
.tfa-adim b{font-size:13.5px;color:var(--ink)}
.tfa-adim span{font-size:12.5px;color:var(--muted);line-height:1.5}
.tfa-gizli{display:inline-block;margin-top:6px;padding:8px 12px;background:var(--bg);
  border:1px solid var(--line);border-radius:8px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:13px;letter-spacing:.08em;word-break:break-all;color:var(--ink)}
.tfa-qr-satir{display:flex;gap:18px;align-items:flex-start;flex-wrap:wrap;margin-top:8px}
.tfa-qr{border:1px solid var(--line);border-radius:10px;padding:8px;background:#fff;flex-shrink:0}
.tfa-elle{display:flex;flex-direction:column;gap:4px;min-width:220px}
.tfa-uri{font-size:12px;color:var(--brand);text-decoration:none;margin-top:2px}
.tfa-uri:hover{text-decoration:underline}
.tfa-form{display:flex;gap:8px;align-items:center;margin-top:8px;flex-wrap:wrap}
.tfa-kod{max-width:150px;text-align:center;font-size:18px;letter-spacing:.3em;font-weight:600;
  font-variant-numeric:tabular-nums;padding-left:.3em}

/* Toolbar içindeki açıklama metni: sağdaki eylem butonunu kenara iter. */
.toolbar .toolbar-aciklama{flex:1;min-width:240px;margin:0;line-height:1.5}

/* --- Finans · nakit akışı takvimi ------------------------------------------ */
/* Beklenen tahsilatın zaman pencerelerine dağılımı. Her kutu tıklanabilir:
   rakamı görüp o faturalara geçememek en sık şikâyet edilen şeydi. */
.fin-nakit{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}
.fn-kutu{display:flex;flex-direction:column;gap:4px;padding:12px 14px;border:1px solid var(--line);
  border-radius:10px;background:var(--card);text-decoration:none;color:inherit;transition:border-color .15s,transform .15s}
.fn-kutu:hover{border-color:var(--brand);transform:translateY(-1px)}
.fn-ad{font-size:12px;font-weight:600;color:var(--muted)}
.fn-tutar{font-size:17px;font-weight:700;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.fn-adet{font-size:11.5px;color:var(--muted)}
.fn-soz{font-size:11.5px;color:var(--accent);font-weight:600;min-height:16px}
.fn-kutu.is-danger .fn-tutar{color:var(--danger)}
.fn-kutu.is-danger{background:var(--danger-soft);border-color:transparent}
.fn-kutu.is-warning{background:var(--warning-soft);border-color:transparent}
.fin-nakit .hbar{height:4px;margin:2px 0}
.fin-nakit .hbar i.h-danger{background:var(--danger)} .fin-nakit .hbar i.h-warning{background:var(--warning)}
.fin-nakit .hbar i.h-brand{background:var(--brand)}   .fin-nakit .hbar i.h-accent{background:var(--accent)}
.fin-nakit .hbar i.h-purple{background:var(--purple)}  .fin-nakit .hbar i.h-muted{background:var(--muted)}

/* Yaşlandırma kovaları artık bağlantı; tıklanabilirlik görünür olmalı. */
a.fy-kova{text-decoration:none;color:inherit;transition:border-color .15s,transform .15s}
a.fy-kova:hover{border-color:var(--brand);transform:translateY(-1px)}

/* --- Finans · ödeme sözleri ------------------------------------------------ */
.soz-liste{display:flex;flex-direction:column;gap:2px}
.soz-satir{display:flex;gap:12px;align-items:flex-start;padding:12px 4px;border-bottom:1px solid var(--line)}
.soz-satir:last-child{border-bottom:0}
.soz-satir.is-geciken{background:var(--danger-soft);border-radius:8px;padding-left:10px;padding-right:10px}
.soz-meta{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.soz-meta b{font-size:13.5px;color:var(--ink)}
.soz-not{font-size:12px;color:var(--muted);line-height:1.45}
.soz-sag{display:flex;flex-direction:column;align-items:flex-end;gap:6px;flex-shrink:0}
.soz-eylem{display:flex;gap:4px}

/* Sekme içi süzgeç çipleri (sözler görünümü). */
.chip-filter{display:inline-flex;align-items:center;padding:5px 12px;border-radius:999px;
  border:1px solid var(--line);background:var(--card);font-size:12.5px;font-weight:600;
  color:var(--muted);text-decoration:none;transition:all .15s}
.chip-filter:hover{border-color:var(--brand);color:var(--brand)}
.chip-filter.is-on{background:var(--brand);border-color:var(--brand);color:#fff}

/* Zaman çizelgesi noktası renkleri (görüşme geçmişi). */
.tl-dot.dot-success{background:var(--success)} .tl-dot.dot-danger{background:var(--danger)}
.tl-dot.dot-accent{background:var(--accent)}   .tl-dot.dot-muted{background:var(--muted)}


/* Yeni Fatura · eylem düğmeleri: birincil eylem üstte, taslak altında. */
.fat-eylem{display:flex;flex-direction:column;gap:8px;margin-top:16px}
.fat-eylem .btn{width:100%;justify-content:center}
/* Belge üzerindeki taslak damgası. */
.pdf-taslak{position:absolute;top:34%;left:50%;transform:translate(-50%,-50%) rotate(-18deg);
  font-size:64px;font-weight:800;letter-spacing:.18em;color:rgba(200,30,50,.10);
  pointer-events:none;user-select:none;white-space:nowrap}
.pdfdoc{position:relative}
/* Belgede uyarı notu: eksik bilgiyi göze sokar ama belgeyi bozmaz. */
.pdf-terms.pdf-not-uyari{border-left:3px solid var(--warning);background:var(--warning-soft);
  padding:10px 12px;border-radius:0 6px 6px 0}

/* --- Tahsilat riski (müşteri dosyası) -------------------------------------- */
/* Skor tek başına güven vermez; kırılımı yanında durur. */
.risk-puan{display:flex;flex-direction:column;align-items:center;gap:2px;padding:14px;
  border-radius:12px;margin-bottom:14px}
.risk-puan.is-danger{background:var(--danger-soft)}
.risk-puan.is-warning{background:var(--warning-soft)}
.risk-puan.is-success{background:var(--success-soft)}
.rp-deger{font-size:34px;font-weight:800;letter-spacing:-.03em;line-height:1}
.risk-puan.is-danger .rp-deger{color:var(--danger)}
.risk-puan.is-warning .rp-deger{color:var(--warning)}
.risk-puan.is-success .rp-deger{color:var(--success)}
.rp-etiket{font-size:12.5px;font-weight:600;color:var(--muted)}
.risk-kirilim{display:flex;flex-direction:column;gap:10px}
.rk-satir{display:grid;grid-template-columns:1fr auto;gap:2px 8px;align-items:center}
.rk-satir span:first-child{font-size:12.5px;color:var(--muted)}
.rk-satir b{font-size:12.5px;font-variant-numeric:tabular-nums}
.rk-satir .hbar{grid-column:1/-1;height:4px}

/* Müşteri dosyası başlığı */
.cust-head-actions{margin-left:auto;display:flex;gap:8px;align-items:flex-start;flex-wrap:wrap}
.thr.thr-info{border-left-color:var(--brand);background:var(--brand-soft)}
.thr.thr-info svg{stroke:var(--brand)}

/* --- Fatura kalemleri ------------------------------------------------------ */
/* Kalem girişi faturanın en çok zaman alan kısmı. Üç yol sunulur: katalogdan
   paket, sık kullanılan hizmet, serbest satır. Tutar sütunu görsel olarak
   ağırlıklıdır — okurken göz oraya gider. */

.kdv-sec{margin-left:auto;display:flex;align-items:center;gap:8px}
.kdv-sec label{font-size:12px;font-weight:600;color:var(--muted)}
.kdv-sec .select{height:32px;padding:0 28px 0 10px;font-size:12.5px;min-width:110px}

.kalem-ekle{display:grid;grid-template-columns:1.35fr 1fr;gap:16px;padding:14px;
  background:var(--bg);border:1px solid var(--line);border-radius:10px;margin-bottom:14px}
@media (max-width:900px){.kalem-ekle{grid-template-columns:1fr}}
.ke-grup{display:flex;flex-direction:column;gap:6px;min-width:0}
.ke-grup > label{font-size:12px;font-weight:600;color:var(--ink)}
.ke-satir{display:flex;gap:8px;align-items:center}
.ke-satir .select{flex:1;min-width:0}
.ke-donem{display:inline-flex;border:1px solid var(--line);border-radius:8px;overflow:hidden;
  background:var(--card);flex-shrink:0}
.ke-btn{border:0;background:transparent;padding:0 12px;height:36px;font-size:12.5px;
  font-weight:600;color:var(--muted);cursor:pointer;transition:background .15s,color .15s}
.ke-btn + .ke-btn{border-left:1px solid var(--line)}
.ke-btn.is-on{background:var(--brand);color:#fff}
.ke-btn:not(.is-on):hover{background:var(--bg)}

.hizli-kalem{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:14px}
.hk-etiket{font-size:12px;font-weight:600;color:var(--muted)}
.hk-cip{border:1px solid var(--line);background:var(--card);border-radius:999px;
  padding:5px 12px;font-size:12px;font-weight:500;color:var(--ink);cursor:pointer;
  transition:border-color .15s,color .15s,background .15s}
.hk-cip:hover{border-color:var(--brand);color:var(--brand);background:var(--brand-soft)}

/* Tablo: grid ile hizalanır, satırlar kart gibi durur. */
/* Yedi sütun (KDV kalem bazına indi) bu kartın genişliğine sığmıyor:
   overflow:hidden ile Tutar sütunu kırpılıyordu. Tablo kendi içinde yatay
   kayıyor — sütunları alt alta yığmak seçenekti ama fatura kalemi satır
   olarak okunuyor, açıklama/miktar/fiyat/KDV/tutar aynı hizada durmalı. */
.kalem-tablo{border:1px solid var(--line);border-radius:10px;
  overflow-x:auto;overflow-y:hidden;
  /* Sabit piksel sütunlar, kapsayıcı kaydırılabilir olsa bile min-content
     genişliğini dışarı sızdırıyor; min-width:0 bunu keser. */
  min-width:0}
.kt-baslik,.kt-satir{display:grid;min-width:700px;
  grid-template-columns:minmax(170px,1fr) 74px 92px 110px 82px 104px 34px;
  gap:10px;align-items:center;padding:10px 12px}
.kt-baslik{text-align:center;background:var(--bg);border-bottom:1px solid var(--line);
  font-size:10.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.kt-sag{text-align:right}
/* Karışık oranlı faturada KDV kırılımı */
.ktt-kirilim{display:grid;grid-template-columns:1fr auto;gap:2px 10px;
  font-size:11.5px;color:var(--muted);padding:2px 0 4px}
.ktt-kirilim b{font-weight:650;color:var(--ink);font-variant-numeric:tabular-nums}
.kt-satir{border-bottom:1px solid var(--line);background:var(--card);transition:background .15s}
.kt-satir:last-child{border-bottom:0}
.kt-satir:hover{background:var(--bg)}
.kt-satir .input,.kt-satir .select{height:36px}
.kt-satir .input[data-adet]{text-align:right;font-variant-numeric:tabular-nums}
/* Sayısal sütunlar sağa yaslı; KDV de bir oran, üstelik fatura detayı ve
   belgede zaten sağa yaslı duruyor. Ok işareti için sağdan pay bırakılıyor. */
.kt-satir .select[data-kdv]{text-align:right;padding-right:28px;padding-left:8px}
/* Birim fiyat: ₺ ön eki alanın içinde durur. */
.kt-fiyat{position:relative}
.kt-fiyat::before{content:"₺";position:absolute;left:10px;top:50%;transform:translateY(-50%);
  font-size:13px;color:var(--muted);pointer-events:none}
.kt-fiyat .input{padding-left:24px;text-align:right;font-variant-numeric:tabular-nums}
/* Satır tutarı: okunurluk için ağırlıklı ve hafif zeminli. */
.kt-tutar{text-align:right;font-size:14px;font-weight:700;font-variant-numeric:tabular-nums;
  color:var(--ink);padding:8px 10px;background:var(--bg);border-radius:8px}
.kt-tutar.is-bos{color:var(--muted);font-weight:500}
/* Silme: satıra gelinceye kadar geri planda durur. */
.kt-sil{width:32px;height:32px;border:0;background:transparent;border-radius:8px;
  color:var(--muted);cursor:pointer;opacity:.35;transition:opacity .15s,background .15s,color .15s}
.kt-satir:hover .kt-sil{opacity:1}
.kt-sil:hover{background:var(--danger-soft);color:var(--danger)}
.kt-sil svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.6;
  stroke-linecap:round;stroke-linejoin:round}

.kt-bos{display:flex;flex-direction:column;align-items:center;gap:4px;padding:30px 20px;text-align:center}
.kt-bos svg{width:28px;height:28px;fill:none;stroke:var(--muted);stroke-width:1.4;
  stroke-linecap:round;stroke-linejoin:round;opacity:.5;margin-bottom:4px}
.kt-bos b{font-size:13.5px;color:var(--ink)}
.kt-bos span{font-size:12.5px;color:var(--muted);line-height:1.5;max-width:380px}

.kalem-alt{display:flex;align-items:flex-start;gap:16px;margin-top:14px;flex-wrap:wrap}
.kt-toplam{margin-left:auto;min-width:230px;display:flex;flex-direction:column;gap:6px}
.ktt-satir{display:flex;justify-content:space-between;align-items:baseline;gap:16px;font-size:13px}
.ktt-satir span{color:var(--muted)}
.ktt-satir b{font-variant-numeric:tabular-nums;font-weight:600}
.ktt-satir.is-genel{border-top:1px solid var(--line);padding-top:8px;margin-top:2px}
.ktt-satir.is-genel span{color:var(--ink);font-weight:600}
.ktt-satir.is-genel b{font-size:17px;font-weight:750;letter-spacing:-.02em}

/* --- Dashboard · kurumsal sadeleştirme ------------------------------------ */
/* Sekmeler tek satırda, açıklama metni başlık niteliğinde (title). Altı çizgili
   seçim, kutu yerine daha az gürültü üretir. */
.dash-sekme{display:flex;gap:4px;align-items:stretch;flex-wrap:wrap;margin-bottom:18px;
  border-bottom:1px solid var(--line);padding-bottom:0}
.dash-sekme .ds-tab{display:flex;align-items:center;gap:8px;padding:9px 14px 11px;
  border:0;border-radius:0;background:transparent;text-decoration:none;color:var(--muted);
  border-bottom:2px solid transparent;transition:color .15s,border-color .15s;box-shadow:none}
.dash-sekme .ds-tab:hover{color:var(--ink)}
.dash-sekme .ds-tab.is-on{color:var(--ink);border-bottom-color:var(--brand);background:transparent}
.ds-ad{font-size:13px;font-weight:600;white-space:nowrap}

/* KPI kartı: rakamın yanında yön, altında mini trend. */
.kpi-card{position:relative;overflow:hidden}
.kpi-trend{display:inline-flex;align-items:center;gap:2px;font-size:11.5px;font-weight:700;
  padding:2px 6px;border-radius:999px;vertical-align:middle;margin-left:6px}
.kpi-trend svg{width:11px;height:11px;fill:none;stroke:currentColor;stroke-width:1.8;
  stroke-linecap:round;stroke-linejoin:round}
.kpi-trend.is-iyi{background:var(--success-soft);color:var(--success)}
.kpi-trend.is-kotu{background:var(--danger-soft);color:var(--danger)}
.kpi-kivrim{position:absolute;left:0;right:0;bottom:0;width:100%;height:28px;opacity:.5}
.kpi-kivrim polyline{fill:none;stroke:var(--brand);stroke-width:1.6;
  vector-effect:non-scaling-stroke;stroke-linecap:round;stroke-linejoin:round}
.kpi-card .kpi-sub{position:relative;z-index:1}

/* Öne çıkan kart: günün işi listesi göz önünde dursun. */
.card-vurgu{position:relative;padding-left:22px}
.card-vurgu::before{content:"";position:absolute;left:0;top:14px;bottom:14px;width:3px;
  border-radius:0 3px 3px 0;background:var(--brand)}

/* Halka grafik: dağılımı açıyla okutur, çubuk listesinden hızlıdır. */
.dash-halka{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.dh-cember{width:132px;height:132px;flex-shrink:0;transform:rotate(-90deg)}
.dh-cember circle{fill:none;stroke-width:5.2}
.dh-zemin{stroke:var(--line)}
.dh-dilim{transition:stroke-width .15s}
.dh-dilim.c-brand{stroke:var(--brand)}   .dh-dilim.c-accent{stroke:var(--accent)}
.dh-dilim.c-purple{stroke:var(--purple)} .dh-dilim.c-success{stroke:var(--success)}
.dh-dilim.c-warning{stroke:var(--warning)} .dh-dilim.c-danger{stroke:var(--danger)}
.dh-liste{flex:1;min-width:190px;display:flex;flex-direction:column;gap:9px}
.dh-satir{display:grid;grid-template-columns:9px 1fr auto auto;gap:9px;align-items:center}
.dh-nokta{width:9px;height:9px;border-radius:3px}
.dh-nokta.c-brand{background:var(--brand)}   .dh-nokta.c-accent{background:var(--accent)}
.dh-nokta.c-purple{background:var(--purple)} .dh-nokta.c-success{background:var(--success)}
.dh-nokta.c-warning{background:var(--warning)} .dh-nokta.c-danger{background:var(--danger)}
.dh-ad{font-size:12.5px;font-weight:600;color:var(--ink);white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis}
.dh-deger{font-size:12.5px;font-weight:650;font-variant-numeric:tabular-nums}
.dh-pay{font-size:11.5px;color:var(--muted);font-variant-numeric:tabular-nums;min-width:34px;text-align:right}

/* Oran göstergesi: hedefe yakınlık yayla görünür. */
.dash-gosterge{display:flex;flex-direction:column;align-items:center;position:relative;padding-top:4px}
.dg-yay{width:170px;height:94px}
.dg-yay path{fill:none;stroke-width:9;stroke-linecap:round}
.dg-zemin{stroke:var(--line)}
.dg-dolu{transition:stroke-dasharray .3s}
.dg-dolu.g-success{stroke:var(--success)} .dg-dolu.g-warning{stroke:var(--warning)}
.dg-dolu.g-danger{stroke:var(--danger)}   .dg-dolu.g-brand{stroke:var(--brand)}
.dg-orta{position:absolute;top:46px;display:flex;flex-direction:column;align-items:center;gap:1px}
.dg-deger{font-size:26px;font-weight:800;letter-spacing:-.03em;line-height:1}
.dg-hedef{font-size:11px;color:var(--muted)}
.dg-alt{font-size:12px;color:var(--muted);text-align:center;margin-top:2px}

/* --- Dashboard · KPI detayı ve öneri kartı -------------------------------- */
/* Rakamın nereden geldiğini görmek, rakamın kendisi kadar önemli: güven oradan
   gelir. Detay varsayılan kapalı — kart sade kalsın, isteyen açsın. */
.kpi-card .kpi-label{text-decoration:none;color:var(--muted);transition:color .15s}
.kpi-card .kpi-label:hover{color:var(--brand)}
.kpi-card a.kpi-value{display:block;text-decoration:none;color:inherit}
.kpi-kiyas{color:var(--muted);font-weight:400}
.kpi-detay{margin-top:10px;position:relative;z-index:1}
.kpi-detay summary{list-style:none;cursor:pointer;font-size:11.5px;font-weight:600;
  color:var(--brand);display:inline-flex;align-items:center;gap:4px;user-select:none}
.kpi-detay summary::-webkit-details-marker{display:none}
.kpi-detay summary::after{content:"";width:0;height:0;border-left:4px solid transparent;
  border-right:4px solid transparent;border-top:5px solid currentColor;transition:transform .15s}
.kpi-detay[open] summary::after{transform:rotate(180deg)}
.kpi-detay .kd-kapa{display:none}
.kpi-detay[open] .kd-ac{display:none}
.kpi-detay[open] .kd-kapa{display:inline}
.kd-govde{margin-top:8px;padding-top:8px;border-top:1px solid var(--line);
  display:flex;flex-direction:column;gap:6px}
.kd-satir{display:flex;justify-content:space-between;align-items:baseline;gap:12px;font-size:12.5px}
.kd-satir span{color:var(--muted)}
.kd-satir b{font-variant-numeric:tabular-nums;font-weight:650}

/* Öneri: panonun verisinden kural tabanlı üretilir, tek eyleme bağlanır. */
.oneri-kart{display:flex;align-items:center;gap:14px;padding:14px 16px}
.ok-ikon{width:34px;height:34px;border-radius:10px;flex-shrink:0;display:flex;
  align-items:center;justify-content:center;background:var(--brand-soft)}
.ok-ikon svg{width:18px;height:18px;fill:none;stroke:var(--brand);stroke-width:1.5;
  stroke-linecap:round;stroke-linejoin:round}
.oneri-kart.is-uyari .ok-ikon{background:var(--warning-soft)}
.oneri-kart.is-uyari .ok-ikon svg{stroke:var(--warning)}
.oneri-kart.is-kritik .ok-ikon{background:var(--danger-soft)}
.oneri-kart.is-kritik .ok-ikon svg{stroke:var(--danger)}
.ok-govde{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.ok-etiket{font-size:10.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;
  color:var(--muted)}
.ok-govde p{margin:0;font-size:13px;line-height:1.5;color:var(--ink)}
.oneri-kart .btn{flex-shrink:0}
@media (max-width:760px){.oneri-kart{flex-wrap:wrap}.oneri-kart .btn{width:100%;justify-content:center}}
.txt-success{color:var(--success)} .txt-warning{color:var(--warning)}

/* --- Görevler · görünüm seçici, kanban, ekip ------------------------------ */
.gorunum-sec{display:inline-flex;border:1px solid var(--line);border-radius:9px;
  overflow:hidden;background:var(--card);flex-shrink:0}
.gs-btn{display:inline-flex;align-items:center;gap:6px;padding:0 14px;height:36px;
  font-size:12.5px;font-weight:600;color:var(--muted);text-decoration:none;
  transition:background .15s,color .15s}
.gs-btn + .gs-btn{border-left:1px solid var(--line)}
.gs-btn svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.6;
  stroke-linecap:round;stroke-linejoin:round}
.gs-btn.is-on{background:var(--brand);color:#fff}
.gs-btn:not(.is-on):hover{background:var(--bg);color:var(--ink)}

.kb-kapsam{display:inline-flex;border:1px solid var(--line);border-radius:9px;overflow:hidden;background:var(--card)}
.kb-kbtn{padding:0 13px;height:36px;display:inline-flex;align-items:center;font-size:12.5px;
  font-weight:600;color:var(--muted);text-decoration:none;transition:background .15s,color .15s}
.kb-kbtn + .kb-kbtn{border-left:1px solid var(--line)}
.kb-kbtn.is-on{background:var(--brand-soft);color:var(--brand)}
.kb-kbtn:not(.is-on):hover{background:var(--bg)}

/* Görev panosu: dört sabit sütun. Kural .kanban'a değil .kb-pano'ya bağlı;
   genel .kanban'ı ezdiğinde lead panosunun yedi sütunu satıra sarıyordu. */
.kb-pano{display:grid;grid-template-columns:repeat(4,minmax(250px,1fr));gap:14px;align-items:start;
  overflow-x:auto;padding-bottom:6px}
.kb-sutun{background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:10px;
  min-height:140px;display:flex;flex-direction:column;gap:10px}
.kb-baslik{display:grid;grid-template-columns:1fr auto;gap:2px 8px;padding:2px 4px 8px;
  border-bottom:2px solid var(--line)}
.kb-baslik.is-brand{border-bottom-color:var(--brand)}
.kb-baslik.is-accent{border-bottom-color:var(--accent)}
.kb-baslik.is-warning{border-bottom-color:var(--warning)}
.kb-baslik.is-success{border-bottom-color:var(--success)}
.kb-ad{font-size:13px;font-weight:700;color:var(--ink)}
.kb-adet{font-size:12px;font-weight:700;color:var(--muted);font-variant-numeric:tabular-nums}
.kb-not{grid-column:1/-1;font-size:11px;color:var(--muted)}
.kb-govde{display:flex;flex-direction:column;gap:8px;min-height:60px;border-radius:8px;
  max-height:calc(100vh - 320px);overflow-y:auto;overscroll-behavior:contain;
  transition:background .15s,box-shadow .15s}
/* İnce kaydırma çubuğu: sütun içinde gezinirken görsel gürültü olmasın. */
.kb-govde::-webkit-scrollbar{width:6px}
.kb-govde::-webkit-scrollbar-thumb{background:var(--line);border-radius:3px}
.kb-govde::-webkit-scrollbar-thumb:hover{background:var(--muted)}
.kb-govde.is-hedef{background:var(--brand-soft);box-shadow:inset 0 0 0 2px var(--brand)}

.kb-kart{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:10px 12px;
  display:flex;flex-direction:column;gap:7px;cursor:grab;
  transition:box-shadow .15s,border-color .15s,transform .1s}
.kb-kart:hover{border-color:var(--brand);box-shadow:var(--shadow)}
.kb-kart.is-tasiniyor{opacity:.45;transform:scale(.98)}
.kb-ust{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.kb-oncelik{width:7px;height:7px;border-radius:2px;flex-shrink:0}
.kb-oncelik.o-kritik{background:var(--danger)} .kb-oncelik.o-yuksek{background:var(--warning)}
.kb-oncelik.o-normal{background:var(--brand)}  .kb-oncelik.o-dusuk{background:var(--muted)}
.kb-kategori{font-size:10.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}
.kb-sistem{font-size:10px;font-weight:600;padding:1px 6px;border-radius:999px;
  background:var(--brand-soft);color:var(--brand)}
.kb-baslik-metin{font-size:13px;font-weight:600;line-height:1.4;color:var(--ink);text-decoration:none}
.kb-atanmamis{font-size:11px;color:var(--muted)}
.kb-baslik-metin:hover{color:var(--brand)}
.kb-kaynak{display:inline-flex;align-items:center;gap:4px;font-size:11.5px;color:var(--muted);
  text-decoration:none;min-width:0}
.kb-kaynak:hover{color:var(--brand)}
.kb-kaynak svg{width:12px;height:12px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.6}
.kb-alt{display:flex;align-items:center;gap:8px;margin-top:1px}
.kb-vade{font-size:11px;font-weight:600;padding:2px 7px;border-radius:999px}
.kb-vade.v-gecikmis{background:var(--danger-soft);color:var(--danger)}
.kb-vade.v-bugun{background:var(--warning-soft);color:var(--warning)}
.kb-vade.v-yakin{background:var(--brand-soft);color:var(--brand)}
.kb-vade.v-uzak,.kb-vade.v-yok{background:var(--bg);color:var(--muted)}
.kb-vade.v-bitti{background:var(--success-soft);color:var(--success)}
.kb-not-sayi{font-size:11px;color:var(--muted)}
.kb-kisi{margin-left:auto;display:flex;align-items:center}
.monogram.mg-xs{width:22px;height:22px;font-size:9px;border-radius:6px}
.kb-ustlen{border:1px dashed var(--line);background:transparent;border-radius:999px;
  padding:2px 9px;font-size:11px;font-weight:600;color:var(--muted);cursor:pointer;
  transition:border-color .15s,color .15s,background .15s}
.kb-ustlen:hover{border-color:var(--brand);color:var(--brand);background:var(--brand-soft)}
.kb-bos{padding:18px 8px;text-align:center;font-size:12px;color:var(--muted)}

.ekip-atanmamis{background:var(--warning-soft)}
.ekip-atanmamis .cust-name{color:var(--warning)}

/* ═══════════════ AJANDA · TAKVİM ═══════════════ */
/* Takvim ızgarası kendi kayıtlarını değil panelin her yerindeki tarihleri
   gösterir; bu yüzden hücre içi kayıt sayısı üçle sınırlı — dördüncüsü hücreyi
   büyütüp ayın şeklini bozuyordu. */
.tk-ust{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.tk-gezin{display:flex;align-items:center;gap:8px}
.tk-ok{width:30px;height:30px;border-radius:8px;border:1px solid var(--line);background:var(--card);
  display:flex;align-items:center;justify-content:center;color:var(--ink);transition:background .15s,border-color .15s}
.tk-ok:hover{background:var(--brand-soft);border-color:var(--brand)}
.tk-ok svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.tk-ay{min-width:150px}
.tk-ay b{display:block;font-size:15px;font-weight:700;color:var(--ink)}
.tk-ay span{display:block;font-size:11.5px;color:var(--muted)}

.tk-suzgec{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:12px;
  padding:10px 14px;background:var(--card);border:1px solid var(--line);border-radius:10px}
.tk-suzgec-ad{font-size:12px;font-weight:600;color:var(--muted)}
.tk-tik{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;color:var(--ink);cursor:pointer}
.tk-tik input{margin:0}
.tk-tik b{color:var(--muted);font-weight:600}
.tk-nokta{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.tk-nokta.n-brand{background:var(--brand)}
.tk-nokta.n-accent{background:var(--accent)}
.tk-nokta.n-success{background:var(--success)}
.tk-nokta.n-warning{background:var(--warning)}
.tk-nokta.n-danger{background:var(--danger)}
.tk-nokta.n-muted{background:var(--muted)}
.tk-temizle{font-size:12px;color:var(--brand);margin-left:auto}
.tk-lejant{display:flex;flex-wrap:wrap;gap:10px 14px}

.takvim{background:var(--card);border:1px solid var(--line);border-radius:12px;overflow:hidden;box-shadow:var(--shadow)}
.tk-gunler{display:grid;grid-template-columns:repeat(7,1fr);background:var(--bg);border-bottom:1px solid var(--line)}
.tk-gunler span{padding:8px 10px;font-size:11px;font-weight:700;letter-spacing:.4px;
  text-transform:uppercase;color:var(--muted)}
.tk-gunler .tk-hs{color:var(--danger)}
.tk-hafta{display:grid;grid-template-columns:repeat(7,1fr);border-bottom:1px solid var(--line)}
.tk-hafta:last-child{border-bottom:0}
.tk-hucre{min-height:104px;padding:6px;border-right:1px solid var(--line);
  display:flex;flex-direction:column;gap:3px}
.tk-hucre:last-child{border-right:0}
.tk-hucre.hs{background:#FAFBFD}
.tk-hucre.disi{background:var(--bg)}
.tk-hucre.disi .tk-gun-no{color:#AEBCCC}
.tk-hucre.disi .tk-kayit{opacity:.55}
.tk-hucre.bugun{background:var(--brand-soft)}
.tk-gun-no{align-self:flex-start;min-width:22px;height:22px;padding:0 5px;border-radius:6px;
  display:inline-flex;align-items:center;justify-content:center;
  font-size:12px;font-weight:600;color:var(--ink);text-decoration:none}
.tk-gun-no:hover{background:var(--card);box-shadow:var(--shadow)}
.tk-hucre.bugun .tk-gun-no{background:var(--brand);color:#fff}
.tk-kayit{display:flex;align-items:center;gap:4px;padding:2px 6px;border-radius:5px;
  font-size:11.5px;line-height:1.35;text-decoration:none;color:var(--ink);
  border-left:2.5px solid var(--muted);background:var(--bg)}
.tk-kayit span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tk-kayit:hover{background:var(--card);box-shadow:var(--shadow)}
.tk-kayit.gecmis{opacity:.6}
.tk-saat{font-style:normal;font-weight:700;color:var(--muted);flex-shrink:0}
.tk-kayit.k-brand{border-left-color:var(--brand);background:var(--brand-soft)}
.tk-kayit.k-accent{border-left-color:var(--accent);background:var(--accent-soft)}
.tk-kayit.k-success{border-left-color:var(--success);background:var(--success-soft)}
.tk-kayit.k-warning{border-left-color:var(--warning);background:var(--warning-soft)}
.tk-kayit.k-danger{border-left-color:var(--danger);background:var(--danger-soft)}
.tk-kayit.k-muted{border-left-color:var(--muted);background:var(--bg)}
.tk-fazla{font-size:11px;color:var(--brand);padding:1px 6px;text-decoration:none}
.tk-fazla:hover{text-decoration:underline}

/* Sıradaki 7 gün şeridi */
.tk-sira{display:flex;flex-direction:column}
.tk-sira-satir{display:flex;align-items:center;gap:10px;padding:9px 2px;
  border-bottom:1px solid var(--line);text-decoration:none;color:inherit}
.tk-sira-satir:last-child{border-bottom:0}
.tk-sira-satir:hover{background:var(--bg)}
.tk-sira-ana{min-width:0;flex:1}
.tk-sira-ana b{display:block;font-size:13px;font-weight:600;color:var(--ink);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tk-sira-ana span{display:block;font-size:11.5px;color:var(--muted)}
.tk-sira-saat{font-size:12px;font-weight:600;color:var(--muted)}

/* Gün slide-over dökümü */
.tk-gun-liste{display:flex;flex-direction:column;gap:8px;margin-top:14px}
.tk-gun-satir{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:10px;
  border:1px solid var(--line);border-left-width:3px;text-decoration:none;color:inherit;background:var(--card)}
.tk-gun-satir:hover{background:var(--bg)}
.tk-gun-satir.k-brand{border-left-color:var(--brand)}
.tk-gun-satir.k-accent{border-left-color:var(--accent)}
.tk-gun-satir.k-success{border-left-color:var(--success)}
.tk-gun-satir.k-warning{border-left-color:var(--warning)}
.tk-gun-satir.k-danger{border-left-color:var(--danger)}
.tk-gun-satir.k-muted{border-left-color:var(--muted)}
.tk-gun-saat{min-width:52px;font-size:12.5px;font-weight:700;color:var(--ink)}
.tk-gun-saat i{font-style:normal;font-weight:500;color:var(--muted);font-size:11.5px}
.tk-gun-ana{min-width:0;flex:1}
.tk-gun-ana b{display:block;font-size:13px;font-weight:600;color:var(--ink)}
.tk-gun-ana span{display:block;font-size:11.5px;color:var(--muted)}

.aj-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}
.aj-grid .aj-genis{grid-column:span 1}
@media (max-width:1100px){.aj-grid{grid-template-columns:1fr}}
.aj-bilgi{display:flex;flex-direction:column;gap:2px;margin-top:14px}
.ab-satir{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid var(--line)}
.ab-satir span{font-size:12.5px;color:var(--muted)}
.ab-satir b{font-size:13px;font-weight:600;color:var(--ink);text-align:right}

/* ═══════════════ AJANDA · HATIRLATICILAR ═══════════════ */
.ht-liste{display:flex;flex-direction:column}
.ht-satir{display:grid;grid-template-columns:104px 1fr auto auto;gap:14px;align-items:center;
  padding:12px 4px;border-bottom:1px solid var(--line)}
.ht-satir:last-child{border-bottom:0}
.ht-satir.a-gecmis{background:linear-gradient(90deg,var(--danger-soft) 0,transparent 40%)}
.ht-satir.a-bugun{background:linear-gradient(90deg,var(--warning-soft) 0,transparent 40%)}
.ht-satir.a-kapali{opacity:.6}
.ht-zaman b{display:block;font-size:13px;font-weight:700;color:var(--ink)}
.ht-zaman span{display:block;font-size:12px;color:var(--muted)}
.ht-rozet{display:inline-block;margin-top:4px;font-style:normal;font-size:10.5px;font-weight:700;
  padding:1px 7px;border-radius:999px}
.ht-rozet.r-gecmis{background:var(--danger-soft);color:var(--danger)}
.ht-rozet.r-bugun{background:var(--warning-soft);color:var(--warning)}
.ht-rozet.r-yarin{background:var(--brand-soft);color:var(--brand)}
.ht-ana{min-width:0}
.ht-ana>b{display:block;font-size:13.5px;font-weight:600;color:var(--ink)}
.ht-ana p{margin:2px 0 0;font-size:12.5px;color:var(--muted);line-height:1.5}
.ht-meta{display:flex;flex-wrap:wrap;gap:6px 10px;margin-top:5px;font-size:11.5px;color:var(--muted)}
.ht-kaynak{color:var(--brand);text-decoration:none}
.ht-kaynak:hover{text-decoration:underline}
.ht-tekrar{background:var(--accent-soft);color:var(--accent);padding:1px 7px;border-radius:999px;font-weight:600}
.ht-durum{background:var(--bg);padding:1px 7px;border-radius:999px}
.ht-eylem{display:flex;gap:6px;align-items:center}

/* ═══════════════ BİLDİRİM KUTUSU ═══════════════ */
.bd-liste{display:flex;flex-direction:column}
.bd-satir{border-bottom:1px solid var(--line);margin:0}
.bd-satir:last-child{border-bottom:0}
.bd-tik{display:flex;align-items:flex-start;gap:12px;width:100%;padding:12px 4px;
  background:none;border:0;text-align:left;cursor:pointer;font:inherit}
.bd-tik:hover{background:var(--bg)}
.bd-satir.yeni .bd-tik{background:var(--brand-soft)}
.bd-satir.yeni .bd-tik:hover{background:#DFEDFA}
.bd-ikon{width:32px;height:32px;border-radius:9px;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;background:var(--brand-soft)}
.bd-ikon svg{width:17px;height:17px;fill:none;stroke:var(--brand);stroke-width:1.6;
  stroke-linecap:round;stroke-linejoin:round}
.bd-ikon.i-uyari{background:var(--warning-soft)}
.bd-ikon.i-uyari svg{stroke:var(--warning)}
.bd-ikon.i-kritik{background:var(--danger-soft)}
.bd-ikon.i-kritik svg{stroke:var(--danger)}
.bd-ana{min-width:0;flex:1}
.bd-ust{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.bd-ust b{font-size:13.5px;font-weight:600;color:var(--ink)}
.bd-tip{font-style:normal;font-size:10.5px;font-weight:700;letter-spacing:.3px;
  text-transform:uppercase;color:var(--muted);background:var(--bg);padding:1px 7px;border-radius:999px}
.bd-metin{display:block;font-size:12.5px;color:var(--muted);line-height:1.5;margin-top:2px}
.bd-zaman{font-size:11.5px;color:var(--muted);white-space:nowrap;flex-shrink:0}
.bd-yeni{width:8px;height:8px;border-radius:50%;background:var(--brand);flex-shrink:0;margin-top:6px}

/* ═══════════════ OPERASYONEL UYARILAR ═══════════════ */
.uy-liste{display:flex;flex-direction:column;gap:10px}
.uy-kart{display:grid;grid-template-columns:104px 1fr auto;gap:16px;align-items:center;
  background:var(--card);border:1px solid var(--line);border-left:3px solid var(--muted);
  border-radius:12px;padding:14px 16px;box-shadow:var(--shadow)}
.uy-kart.c-kritik{border-left-color:var(--danger)}
.uy-kart.c-uyari{border-left-color:var(--warning)}
.uy-kart.c-bilgi{border-left-color:var(--accent)}
.uy-kart.sus{opacity:.62}
.uy-sol{text-align:center}
.uy-alan{display:block;font-size:10.5px;font-weight:700;letter-spacing:.4px;
  text-transform:uppercase;color:var(--muted)}
.uy-adet{display:block;font-size:24px;font-weight:700;color:var(--ink);line-height:1.2}
.uy-deger{display:block;font-size:12px;font-weight:600;color:var(--muted)}
.uy-ana{min-width:0}
.uy-baslik{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:3px}
.uy-baslik b{font-size:14px;font-weight:650;color:var(--ink)}
.uy-ana p{margin:0;font-size:12.5px;color:var(--muted);line-height:1.55}
.uy-rozet{font-size:10.5px;font-weight:700;letter-spacing:.3px;text-transform:uppercase;
  padding:2px 8px;border-radius:999px}
.uy-rozet.r-kritik{background:var(--danger-soft);color:var(--danger)}
.uy-rozet.r-uyari{background:var(--warning-soft);color:var(--warning)}
.uy-rozet.r-bilgi{background:var(--accent-soft);color:var(--accent)}
.uy-sus-rozet{font-size:11px;color:var(--muted);background:var(--bg);padding:2px 8px;border-radius:999px}
.uy-eylem{display:flex;flex-direction:column;gap:6px;align-items:stretch}
.uy-eylem form{margin:0}
.uy-eylem .btn{white-space:nowrap;justify-content:center}
@media (max-width:900px){
  .uy-kart{grid-template-columns:1fr;gap:10px}
  .uy-sol{display:flex;align-items:baseline;gap:8px;text-align:left}
  .uy-adet{font-size:18px}
  .ht-satir{grid-template-columns:1fr;gap:8px}
}

/* ═══════════════ ZİL PANELİ ═══════════════ */
/* Zil her ekranda erişilebilir olmalı: panel üst bardan açılır, sayfa
   yüklendiğinde tek bir özet isteğiyle dolar. */
.zil-sar{position:relative}
.zil-say{position:absolute;top:1px;right:1px;min-width:16px;height:16px;padding:0 4px;
  border-radius:999px;background:var(--danger);color:#fff;font-size:10px;font-weight:700;
  display:flex;align-items:center;justify-content:center;border:2px solid var(--card)}
.zil-panel{position:absolute;top:calc(100% + 10px);right:0;width:380px;max-width:calc(100vw - 24px);
  background:var(--card);border:1px solid var(--line);border-radius:12px;
  box-shadow:0 8px 32px rgba(15,49,86,.16);z-index:60;overflow:hidden}
.zp-sekme{display:flex;border-bottom:1px solid var(--line);background:var(--bg)}
.zp-tab{flex:1;padding:10px 8px;background:none;border:0;border-bottom:2px solid transparent;
  font:inherit;font-size:12.5px;font-weight:600;color:var(--muted);cursor:pointer;
  display:flex;align-items:center;justify-content:center;gap:6px}
.zp-tab.is-on{color:var(--brand);border-bottom-color:var(--brand);background:var(--card)}
.zp-tab b{min-width:17px;height:17px;padding:0 5px;border-radius:999px;background:var(--brand);
  color:#fff;font-size:10px;display:flex;align-items:center;justify-content:center}
.zp-tab b.s-kritik{background:var(--danger)}
.zp-govde{max-height:400px;overflow-y:auto}
.zp-bos{padding:28px 20px;text-align:center;font-size:12.5px;color:var(--muted)}
.zp-satir{display:flex;align-items:flex-start;gap:10px;padding:11px 14px;
  border-bottom:1px solid var(--line);text-decoration:none;color:inherit}
.zp-satir:last-child{border-bottom:0}
.zp-satir:hover{background:var(--bg)}
.zp-satir.yeni{background:var(--brand-soft)}
.zp-nokta{width:7px;height:7px;border-radius:50%;background:var(--brand);flex-shrink:0;margin-top:6px}
.zp-nokta.o-uyari{background:var(--warning)}
.zp-nokta.o-kritik{background:var(--danger)}
.zp-ana{min-width:0;flex:1}
.zp-ana b{display:block;font-size:12.8px;font-weight:600;color:var(--ink);line-height:1.4}
.zp-ana span{display:block;font-size:11.5px;color:var(--muted);line-height:1.45;margin-top:1px;
  overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.zp-zaman{font-size:10.5px;color:var(--muted);white-space:nowrap;flex-shrink:0;margin-top:2px}
.zp-adet{font-size:11px;font-weight:700;color:var(--muted);background:var(--bg);
  padding:2px 7px;border-radius:999px;flex-shrink:0}
.zp-alt{display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:9px 14px;border-top:1px solid var(--line);background:var(--bg)}
.zp-link{background:none;border:0;font:inherit;font-size:12px;font-weight:600;
  color:var(--brand);cursor:pointer;text-decoration:none;padding:0}
.zp-link:hover{text-decoration:underline}
.gs-say{min-width:17px;height:17px;padding:0 5px;border-radius:999px;background:var(--brand);
  color:#fff;font-size:10px;font-weight:700;display:inline-flex;align-items:center;justify-content:center}
.gs-say.s-kritik{background:var(--danger)}

/* Dashboard kritik uyarı şeridi — panonun üstünde, sekmelerin hemen öncesinde. */
.uy-serit{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:16px;
  padding:12px 16px;border-radius:12px;background:var(--danger-soft);
  border:1px solid rgba(217,56,67,.22)}
.uys-bas{display:flex;align-items:center;gap:8px;flex-shrink:0}
.uys-bas svg{width:18px;height:18px;fill:none;stroke:var(--danger);stroke-width:1.7;
  stroke-linecap:round;stroke-linejoin:round}
.uys-bas b{font-size:13.5px;font-weight:700;color:var(--danger)}
.uys-bas span{font-size:12px;color:var(--muted)}
.uys-liste{display:flex;gap:8px;flex-wrap:wrap;flex:1;min-width:0}
.uys-kart{display:flex;align-items:baseline;gap:7px;padding:5px 11px;border-radius:8px;
  min-width:0;background:var(--card);border:1px solid rgba(217,56,67,.18);text-decoration:none}
.uys-kart:hover{border-color:var(--danger)}
.uys-kart b{font-size:14px;font-weight:700;color:var(--danger)}
.uys-kart span{font-size:12px;color:var(--ink);white-space:nowrap;overflow:hidden;
  text-overflow:ellipsis;max-width:260px}
.uys-tumu{font-size:12.5px;font-weight:600;color:var(--danger);white-space:nowrap;text-decoration:none}
.uys-tumu:hover{text-decoration:underline}
/* Dar ekranda uyarı kartları başlığın yanındaki dar şeride sığmıyor ve
   daralamadıkları için sayfayı yana kaydırıyorlardı (telefonda 430px'te
   196px taşma). Şerit alt alta diziliyor, kartlar satırı paylaşıyor. */
@media (max-width:767px){
  .uy-serit{flex-direction:column;align-items:stretch;gap:10px}
  .uys-liste{width:100%}
  .uys-kart{flex:1 1 200px}
  .uys-kart span{max-width:none}
  .uys-tumu{align-self:flex-start}
}

/* ═══════════════ ALACAK ZAMAN EKSENİ ═══════════════ */
/* Yaşlandırma ve nakit akışı aynı parayı gösteriyordu; farkları yalnız eksenin
   yönüydü. Tek eksende, bugünün iki yanında gösterince fark kendiliğinden
   anlaşılıyor: sol = geciken, sağ = yolda olan. */

/* Üstteki iki cümlelik okuma anahtarı — grafikten önce gelir.
   Önek "az-": ekstredeki .ek-ozet ile çakışmasın (aynı ad, farklı yerleşim). */
.az-ozet{display:grid;grid-template-columns:1fr auto 1fr;gap:14px;align-items:stretch;
  margin:4px 0 18px}
.az-ozet-kut{padding:14px 16px;border-radius:12px;border:1px solid var(--line)}
.az-ozet-kut.e-gecmis{background:var(--danger-soft);border-color:rgba(217,56,67,.2)}
.az-ozet-kut.e-gelecek{background:var(--brand-soft);border-color:rgba(18,116,197,.2)}
.az-ozet-ust{display:flex;align-items:center;justify-content:space-between;gap:10px}
.ek-etiket{font-size:11px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;color:var(--muted)}
.ek-rozet{font-size:11.5px;font-weight:700;padding:2px 9px;border-radius:999px}
.ek-rozet.r-danger{background:var(--danger);color:#fff}
.ek-rozet.r-brand{background:var(--brand);color:#fff}
.az-ozet-tutar{font-size:26px;font-weight:700;color:var(--ink);line-height:1.25;margin:4px 0 6px}
.az-ozet-kut p{margin:0;font-size:12.5px;line-height:1.55;color:var(--muted)}
.az-ozet-kut p b{color:var(--ink);font-weight:650}
.az-ozet-ok{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;
  padding:0 4px}
.az-ozet-ok span{font-size:10.5px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;
  color:var(--muted);white-space:nowrap}
.az-ozet-ok svg{width:20px;height:34px;fill:none;stroke:var(--line);stroke-width:1.6;
  stroke-linecap:round;stroke-linejoin:round}

/* Eksen: sol taraf sağa yaslı, sağ taraf sola yaslı, ortada bugün çizgisi. */
.ek-eksen{display:grid;grid-template-columns:4fr auto 5fr;align-items:stretch;
  border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--card)}
.ek-taraf{padding:14px 16px 12px}
.ek-taraf.t-gecmis{background:linear-gradient(90deg,rgba(253,236,238,.85) 0,rgba(253,236,238,.25) 100%)}
.ek-taraf.t-gelecek{background:linear-gradient(90deg,rgba(233,243,252,.55) 0,rgba(233,243,252,.12) 100%)}
.ek-baslik{margin-bottom:12px}
.ek-baslik b{font-size:13.5px;font-weight:700;color:var(--ink)}
.ek-baslik{display:flex;flex-direction:column;align-items:flex-start;gap:1px}
.t-gelecek .ek-baslik{align-items:flex-end}
/* Başlık ve bilgi ikonu aynı satırda dursun. */
.ek-baslik b{display:inline-flex;align-items:center;gap:6px}
.ek-baslik span{display:block;font-size:11.5px;color:var(--muted)}
.t-gelecek .ek-baslik{text-align:right}

.ek-kovalar{display:flex;gap:8px;align-items:stretch}
.ek-kova{flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;
  justify-content:flex-start;gap:3px;
  padding:8px 5px 9px;border-radius:9px;text-decoration:none;
  border:1px solid transparent;transition:background .15s,border-color .15s}
.ek-kova:hover{background:var(--card);border-color:var(--line);box-shadow:var(--shadow)}
.ek-kova.bos{opacity:.45}
.ek-kova.bos:hover{opacity:.7}
/* Çubuk sabit yükseklikte bir kap; içindeki dolgu tutara göre büyür. Kap
   olmadan kısa sütunlar dibe yapışıp karşılaştırılamaz hâle geliyordu. */
.ek-cubuk{width:100%;max-width:46px;height:88px;border-radius:6px;background:rgba(15,49,86,.06);
  display:flex;align-items:flex-end;overflow:hidden}
.ek-cubuk i{width:100%;border-radius:6px;min-height:3px;background:var(--muted);
  transition:height .2s}
.ek-kova.k-danger .ek-cubuk i{background:var(--danger)}
.ek-kova.k-warning .ek-cubuk i{background:var(--warning)}
.ek-kova.k-brand .ek-cubuk i{background:var(--brand)}
.ek-kova.k-accent .ek-cubuk i{background:var(--accent)}
.ek-kova.k-muted .ek-cubuk i{background:#9FB0C4}
.ek-tutar{font-size:12.5px;font-weight:700;color:var(--ink);white-space:nowrap;margin-top:3px}
.ek-ad{font-size:11.5px;font-weight:600;color:var(--ink)}
.ek-adet{font-size:10.5px;color:var(--muted);text-align:center;line-height:1.3}
.ek-soz{font-size:10.5px;font-weight:600;color:var(--accent);background:var(--accent-soft);
  padding:1px 7px;border-radius:999px;margin-top:2px;white-space:nowrap}

/* Bugün çizgisi: iki tarafı ayıran dikey ayraç. */
.ek-bugun{position:relative;width:34px;background:var(--ink)}
.ek-bugun span{position:absolute;top:50%;left:50%;
  transform:translate(-50%,-50%) rotate(180deg);writing-mode:vertical-rl;
  font-size:10.5px;font-weight:700;letter-spacing:2px;color:#fff}

.ek-aciklama{display:flex;flex-direction:column;gap:9px;margin-top:14px;padding:13px 15px;
  background:var(--bg);border-radius:10px}
.ek-ac-satir{display:flex;gap:10px;align-items:flex-start;font-size:12.5px;line-height:1.55;
  color:var(--muted)}
.ek-ac-satir b{color:var(--ink);font-weight:650}
.ek-nokta{width:9px;height:9px;border-radius:50%;flex-shrink:0;margin-top:5px}
.ek-nokta.n-danger{background:var(--danger)}
.ek-nokta.n-brand{background:var(--brand)}
.ek-nokta.n-muted{background:#9FB0C4}

@media (max-width:1000px){
  .az-ozet{grid-template-columns:1fr}
  .az-ozet-ok{flex-direction:row;gap:8px;padding:2px 0}
  .az-ozet-ok svg{width:34px;height:20px;transform:rotate(-90deg)}
  .ek-eksen{grid-template-columns:1fr}
  .ek-bugun{width:auto;height:26px}
  .ek-bugun span{writing-mode:horizontal-tb;transform:translate(-50%,-50%);letter-spacing:3px}
  .t-gelecek .ek-baslik{text-align:left}
}

/* ═══════════════ VERİ TABLOSU (dt-*) ═══════════════ */
/* Kayıt sayısı arttıkça uzayan tablolar ekranı kullanılamaz hâle getiriyordu.
   Bu bileşen sıralama, segment ve sayfalamayı tek yerden verir; başka
   listelerde de aynı desenle kullanılabilir. */
.dt-ust{display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  padding:12px 0 14px;border-bottom:1px solid var(--line);margin-bottom:2px}
.dt-seg{display:flex;gap:6px;flex-wrap:wrap}
.dt-seg-btn{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:999px;
  border:1px solid var(--line);background:var(--card);font-size:12.5px;font-weight:600;
  color:var(--muted);text-decoration:none;transition:border-color .15s,color .15s,background .15s}
.dt-seg-btn:hover{border-color:var(--brand);color:var(--brand)}
.dt-seg-btn.is-on{background:var(--brand);border-color:var(--brand);color:#fff}
.dt-seg-btn b{font-weight:700;font-size:11.5px;padding:0 6px;border-radius:999px;
  background:var(--bg);color:var(--muted)}
.dt-seg-btn.is-on b{background:rgba(255,255,255,.22);color:#fff}
.dt-seg-btn b.s-danger{background:var(--danger-soft);color:var(--danger)}
.dt-seg-btn.is-on b.s-danger{background:rgba(255,255,255,.22);color:#fff}
.dt-ara{margin-left:auto;min-width:220px}

/* Sıralanabilir başlık */
.dt-sort{display:inline-flex;align-items:center;gap:5px;color:inherit;text-decoration:none;
  white-space:nowrap}
.dt-sort::after{content:"";width:0;height:0;border-left:3.5px solid transparent;
  border-right:3.5px solid transparent;border-top:4px solid var(--line);opacity:.9}
.dt-sort:hover{color:var(--brand)}
.dt-sort:hover::after{border-top-color:var(--brand)}
.dt-sort.is-on{color:var(--brand)}
.dt-sort.is-on.y-desc::after{border-top-color:var(--brand)}
.dt-sort.is-on.y-asc::after{border-top:0;border-bottom:4px solid var(--brand)}

/* Satır ciddiyet şeridi: gözün önce nereye gideceğini söyler. */
.mini-table.dt tbody tr.dt-satir{border-left:3px solid transparent}
.mini-table.dt tbody tr.dt-satir.c-kritik{border-left-color:var(--danger)}
.mini-table.dt tbody tr.dt-satir.c-uyari{border-left-color:var(--warning)}
.mini-table.dt tbody tr.dt-satir td:first-child{padding-left:11px}

/* Gecikme rozeti */
/* .hbar flex kapsayıcı için yazılmış; tablo hücresinde doğrudan <span> olarak
   kullanılınca inline kalıyor ve genişlik/yükseklik uygulanmıyordu. */
.mini-table .hbar{display:block}
.gun-rozet{display:inline-block;font-size:11.5px;font-weight:700;padding:2px 9px;
  border-radius:999px;white-space:nowrap;font-variant-numeric:tabular-nums}
.gun-rozet.g-normal{background:var(--warning-soft);color:var(--warning)}
.gun-rozet.g-uyari{background:#FDE8D4;color:#9A4B0A}
.gun-rozet.g-kritik{background:var(--danger-soft);color:var(--danger)}

/* Alt şerit: aralık, sayfa boyutu, sayfalama */
.dt-alt{display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  padding-top:12px;margin-top:4px;border-top:1px solid var(--line)}
.dt-bilgi{font-size:12.5px;color:var(--muted)}
.dt-bilgi b{color:var(--ink)}
.dt-boyut{margin-left:14px}
.dt-b{display:inline-block;padding:1px 7px;border-radius:6px;font-size:12px;font-weight:600;
  color:var(--muted);text-decoration:none}
.dt-b:hover{background:var(--bg);color:var(--brand)}
.dt-b.is-on{background:var(--brand-soft);color:var(--brand)}
.dt-sayfa{display:flex;align-items:center;gap:4px;margin-left:auto;flex-wrap:wrap}
/* Sayfa numaraları telefonda satıra sarmalı: sarmayan şerit (42 sayfalık lead
   listesinde 8-10 düğme) sayfayı ekrandan geniş yapıyor, tarayıcı da bütün
   düzeni küçültüp gösteriyordu — "mobilde her şey ufacık" görüntüsünün
   ikinci sebebi buydu. */
@media (max-width:767px){
  .dt-sayfa{margin-left:0;width:100%;justify-content:center}
  .dt-alt{justify-content:center;text-align:center}
}
.dt-s{min-width:30px;height:30px;padding:0 8px;border-radius:8px;border:1px solid var(--line);
  background:var(--card);display:inline-flex;align-items:center;justify-content:center;
  font-size:12.5px;font-weight:600;color:var(--ink);text-decoration:none}
.dt-s:hover{border-color:var(--brand);color:var(--brand)}
.dt-s.is-on{background:var(--brand);border-color:var(--brand);color:#fff}
.dt-ara-nokta,.dt-sayfa .dt-ara{color:var(--muted);padding:0 2px;font-size:12.5px}

/* ═══════════════ ÖDEME BİLDİRİMLERİ ═══════════════ */
.bl-liste{display:flex;flex-direction:column;gap:10px;padding-top:12px}
.bl-kart{display:grid;grid-template-columns:minmax(180px,1fr) minmax(0,1.4fr) auto;gap:16px;
  align-items:center;padding:14px 16px;border:1px solid var(--line);border-radius:12px;
  background:var(--card)}
.bl-kart.bekliyor{border-left:3px solid var(--warning);background:#FFFDF8}
.bl-sol{display:flex;align-items:center;gap:10px;min-width:0}
.bl-kim{min-width:0}
.bl-kim b{display:block;font-size:13.5px;font-weight:650;color:var(--ink);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bl-kim span{display:block;font-size:11.5px;color:var(--muted)}
.bl-eslesmedi{display:inline-block;margin-top:3px;font-size:10.5px;font-weight:700;
  padding:1px 7px;border-radius:999px;background:var(--danger-soft);color:var(--danger)}
.bl-orta{min-width:0}
.bl-tutar{font-size:18px;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums}
.bl-detay{display:flex;flex-wrap:wrap;gap:5px 8px;margin-top:3px}
.bl-detay span{font-size:11.5px;color:var(--muted);background:var(--bg);
  padding:1px 8px;border-radius:999px}
.bl-not{margin:6px 0 0;font-size:12px;color:var(--muted);line-height:1.5}
.bl-sag{display:flex;flex-direction:column;align-items:flex-end;gap:7px}
.bl-form{display:flex;align-items:center;gap:6px;margin:0}
.bl-select{min-width:180px;height:32px;font-size:12.5px}
.bl-gorev{font-size:11.5px;color:var(--brand);text-decoration:none}
.bl-gorev:hover{text-decoration:underline}
@media (max-width:1100px){
  .bl-kart{grid-template-columns:1fr}
  .bl-sag{align-items:stretch}
  .bl-form{flex-wrap:wrap}
}

/* ═══════════════ AYARLAR · SKOR / EŞİK / SATIŞ ═══════════════ */
/* Bir eşiği değiştiren kişi neyi değiştirdiğini görmeli: açıklama alanları
   ayarın yanında durur, ayrı bir dokümana bakmayı gerektirmez. */
.skor-anlat{display:flex;flex-direction:column;gap:10px;padding:14px 16px;margin-bottom:16px;
  background:var(--bg);border-radius:10px}
.sa-satir{display:grid;grid-template-columns:150px 1fr;gap:14px;align-items:start}
.sa-et{font-size:11px;font-weight:700;letter-spacing:.4px;text-transform:uppercase;
  color:var(--muted);padding-top:2px}
.sa-satir p{margin:0;font-size:12.8px;line-height:1.6;color:var(--ink)}
@media (max-width:760px){.sa-satir{grid-template-columns:1fr;gap:3px}}

.agirlik-giris{display:inline-flex;align-items:center;gap:6px;justify-content:flex-end}
.agirlik-giris .input{width:76px;text-align:right;height:32px;font-variant-numeric:tabular-nums}
.agirlik-giris span{font-size:11.5px;color:var(--muted)}
.agirlik-toplam{font-size:15px;font-weight:700;color:var(--success);font-variant-numeric:tabular-nums}
.agirlik-toplam.hatali{color:var(--danger)}
.mini-table tfoot td{padding:10px 8px;border-top:1px solid var(--line)}

.ayar-alt{display:flex;align-items:center;gap:16px;flex-wrap:wrap;
  padding-top:14px;margin-top:14px;border-top:1px solid var(--line)}
.ayar-alt .setting-desc{flex:1;min-width:240px;margin:0}
.ayar-alt .btn{margin-left:auto}

/* Eşik kartları */
.esik-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(310px,1fr));gap:12px;
  padding-top:12px}
.esik-kart{padding:13px 15px;border:1px solid var(--line);border-radius:10px;background:var(--card)}
.esik-ust{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:6px}
.esik-ust label{font-size:13px;font-weight:650;color:var(--ink);margin:0;cursor:pointer}
.esik-giris{display:inline-flex;align-items:center;gap:6px;flex-shrink:0}
.esik-giris .input{width:82px;text-align:right;height:32px;font-variant-numeric:tabular-nums}
.esik-giris span{font-size:11.5px;color:var(--muted);min-width:38px}
.esik-kart p{margin:0 0 6px;font-size:12.3px;line-height:1.55;color:var(--muted)}
.esik-sinir{font-size:11px;color:var(--muted);opacity:.85}

/* Satış tipi seçimi */
.radio-satir{display:flex;gap:8px}
.radio-mini{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:8px;
  border:1px solid var(--line);font-size:12.5px;font-weight:600;color:var(--ink);cursor:pointer;
  transition:border-color .15s,background .15s}
.radio-mini:hover{border-color:var(--brand)}
.radio-mini input{accent-color:var(--brand);margin:0}
.radio-mini:has(input:checked){border-color:var(--brand);background:var(--brand-soft);color:var(--brand)}

/* ═══════════════ FİRMA CARİ HESABI ═══════════════ */
/* Devir bakiyesi + devir sonrası hareketler. Sol blok sonucu, sağ blok o
   sonucun nasıl oluştuğunu gösterir: tutarın nereden geldiği görünmeden
   bakiyeye güvenilmiyor. */
.cari-ust{display:grid;grid-template-columns:minmax(240px,1fr) minmax(0,1.6fr);gap:16px;
  margin-bottom:16px;align-items:stretch}
@media (max-width:900px){.cari-ust{grid-template-columns:1fr}}

.cari-bakiye{display:flex;flex-direction:column;justify-content:center;gap:4px;
  padding:20px 22px;border-radius:12px;border:1px solid var(--line);background:var(--card)}
.cari-bakiye.b-danger{background:var(--danger-soft);border-color:rgba(217,56,67,.22)}
.cari-bakiye.b-success{background:var(--success-soft);border-color:#BFE8D4}
.cari-bakiye.b-muted{background:var(--bg)}
.cb-et{font-size:11px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;color:var(--muted)}
.cb-tutar{font-size:30px;font-weight:750;letter-spacing:-.02em;color:var(--ink);
  font-variant-numeric:tabular-nums;line-height:1.15}
.cari-bakiye.b-danger .cb-tutar{color:var(--danger)}
.cari-bakiye.b-success .cb-tutar{color:var(--success)}
.cb-yon{font-size:12.5px;font-weight:600;color:var(--muted)}

.cari-hesap{display:flex;flex-direction:column;justify-content:center;
  padding:14px 18px;border:1px solid var(--line);border-radius:12px;background:var(--card)}
.ch-satir{display:flex;align-items:baseline;justify-content:space-between;gap:16px;
  padding:7px 0;border-bottom:1px solid var(--line)}
.ch-satir:last-child{border-bottom:0}
.ch-ad{font-size:12.8px;color:var(--ink)}
.ch-ad i{font-style:normal;font-size:11.5px;color:var(--muted);margin-left:5px}
.ch-tutar{font-size:13.5px;font-weight:650;color:var(--ink);white-space:nowrap;
  font-variant-numeric:tabular-nums}
.ch-tutar.eksi{color:var(--muted)}
.ch-sonuc{margin-top:4px;padding-top:11px;border-top:2px solid var(--line);border-bottom:0}
.ch-sonuc .ch-ad{font-weight:700}
.ch-sonuc .ch-tutar{font-size:16px;font-weight:750}
.ch-sonuc .ch-tutar i{font-style:normal;font-size:11.5px;font-weight:500;color:var(--muted);
  margin-left:6px}

/* Ekstredeki devir satırı: hareket değil, başlangıç noktasıdır. */
.mini-table tr.ce-devir{background:var(--brand-soft)}
.mini-table tr.ce-devir b{color:var(--brand)}

/* ═══════════════ ENTEGRASYONLAR · OLAY AKIŞI ═══════════════ */
/* Olaylar tabloya sığmıyor: ham gövde çok satırlı, hata metni uzun. Kart
   listesi, her kaydın kendi yüksekliğini almasına izin verir. */
.ol-liste{display:flex;flex-direction:column;gap:8px;padding-top:4px}
.ol-satir{
  border:1px solid var(--line);border-radius:10px;padding:11px 13px;
  background:var(--card);border-left:3px solid transparent;
}
.ol-satir.hatali{border-left-color:var(--danger);background:var(--danger-soft)}
.ol-ust{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.ol-ust b{font-size:13.5px;font-weight:650}
.ol-kaynak{
  font-size:11px;font-weight:600;color:var(--muted);
  background:var(--bg);border:1px solid var(--line);border-radius:5px;padding:1px 7px;
}
.ol-disid{font-size:11.5px;color:var(--muted);font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.ol-zaman{margin-left:auto;font-size:11.5px;color:var(--muted);font-variant-numeric:tabular-nums}
.ol-meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:5px;
  font-size:12px;color:var(--muted)}
.ol-meta a{color:var(--brand);font-weight:600}
.ol-hata{margin:7px 0 0;font-size:12.5px;color:var(--danger);line-height:1.45}
.ol-alt{display:flex;align-items:center;gap:12px;margin-top:8px}
.ol-govde{flex:1;min-width:0}
.ol-govde summary{font-size:11.5px;color:var(--muted);cursor:pointer;user-select:none}
.ol-govde summary:hover{color:var(--brand)}
.ol-govde pre{
  margin:7px 0 0;padding:9px 11px;border-radius:8px;
  background:var(--bg);border:1px solid var(--line);
  font-size:11.5px;line-height:1.5;max-height:220px;overflow:auto;
  white-space:pre-wrap;word-break:break-word;
}

/* ═══════════════ ENTEGRASYONLAR · SAĞLAYICI SAĞLIĞI ═══════════════ */
/* "Sağlayıcıda genel sorun mu, tek müşteride mi" sorusu bağlantı listesinden
   okunamıyor; bu görünüm aynı sağlayıcının tüm bağlantılarını yan yana koyar. */
.sg-liste{display:flex;flex-direction:column;gap:9px;padding-top:6px}
.sg-kart{
  display:grid;grid-template-columns:170px minmax(150px,1fr) auto auto;
  align-items:center;gap:16px;
  border:1px solid var(--line);border-left:3px solid var(--line);
  border-radius:10px;padding:12px 14px;background:var(--card);
}
.sg-kart.s-success{border-left-color:var(--success)}
.sg-kart.s-warning{border-left-color:var(--warning)}
.sg-kart.s-danger{border-left-color:var(--danger)}
.sg-kart.s-pasif{border-left-color:var(--line)}
.sg-kart.s-pasif .sg-sol b{color:var(--muted)}
.sg-sol{display:flex;flex-direction:column;gap:2px;min-width:0}
.sg-sol b{font-size:13.5px;font-weight:650}
.sg-sol span{font-size:11.5px;color:var(--muted)}
.sg-cubuk{height:8px;border-radius:5px;background:var(--bg);overflow:hidden;
  border:1px solid var(--line)}
.sg-cubuk i{display:block;height:100%;border-radius:5px;transition:width .3s}
.sg-cubuk i.c-success{background:var(--success)}
.sg-cubuk i.c-warning{background:var(--warning)}
.sg-cubuk i.c-danger{background:var(--danger)}
.sg-cubuk i.c-pasif{background:var(--muted)}
.sg-durum{margin-top:5px;font-size:12px;color:var(--muted)}
.sg-sayilar{display:flex;flex-direction:column;gap:2px;font-size:11.5px;
  color:var(--muted);white-space:nowrap}
.sg-sayilar b{font-variant-numeric:tabular-nums;color:var(--ink)}
.sg-sayilar .s-ok b{color:var(--success)}
.sg-sayilar .s-kotu b{color:var(--danger)}
.sg-sag{display:flex;align-items:center;gap:9px;flex-wrap:wrap;justify-content:flex-end}
.sg-etki{font-size:11.5px;color:var(--muted);font-variant-numeric:tabular-nums}
@media (max-width:900px){
  .sg-kart{grid-template-columns:1fr;gap:10px}
  .sg-sag{justify-content:flex-start}
}

/* ═══════════════ TOOLLAR · ORTAK ═══════════════ */
.tl-dot.tl-brand{background:var(--brand)}
.modal.is-genis{max-width:720px}
.chip.chip-on{background:var(--brand);border-color:var(--brand);color:#fff}
.chip.chip-on b{color:#fff}
.spin{
  width:14px;height:14px;border-radius:50%;display:inline-block;
  border:2px solid var(--line);border-top-color:var(--brand);
  animation:spin .7s linear infinite;
}
@keyframes spin{to{transform:rotate(360deg)}}

/* ═══════════════ TOOLLAR · MÜKELLEFİYET SORGUSU ═══════════════ */
.gib-sorgu{display:flex;gap:10px;align-items:center;padding:12px 0 4px}
.gib-yukle{margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}
.gib-yukle .modal-field{margin-bottom:10px}
.tool-aksiyon{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px;
  padding-top:12px;border-top:1px solid var(--line)}

.gib-sonuc{display:flex;flex-direction:column;gap:12px;padding-top:6px}
.gs-kimlik{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:10px;
  border:1px solid var(--line)}
.gs-kimlik.ok{background:var(--success-soft);border-color:transparent}
.gs-kimlik.kotu{background:var(--danger-soft);border-color:transparent}
.gs-kimlik.notr .gs-ikon{background:var(--muted);color:#fff}
.gs-kimlik .gs-ikon{width:30px;height:30px;border-radius:50%;flex-shrink:0;
  display:flex;align-items:center;justify-content:center}
.gs-kimlik.ok .gs-ikon{background:var(--success);color:#fff}
.gs-kimlik.kotu .gs-ikon{background:var(--danger);color:#fff}
.gs-kimlik .gs-ikon svg{width:16px;height:16px;fill:none;stroke:currentColor;
  stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.gs-kimlik b{display:block;font-size:15px;font-variant-numeric:tabular-nums;letter-spacing:.02em}
.gs-kimlik span{font-size:12.5px;color:var(--muted)}

.gs-belge{border-radius:10px;padding:14px 16px;border:1px solid var(--line);
  border-left:3px solid var(--line)}
.gs-belge.b-efatura{border-left-color:var(--success);background:var(--success-soft)}
.gs-belge.b-earsiv{border-left-color:var(--accent);background:var(--accent-soft)}
.gs-belge.b-belirsiz{border-left-color:var(--warning);background:var(--warning-soft)}
.gsb-et{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  color:var(--muted)}
.gsb-ad{font-size:20px;font-weight:700;margin:2px 0 5px}
.gs-belge p{margin:0;font-size:12.5px;line-height:1.5;color:var(--ink)}

.gs-kart{border:1px solid var(--line);border-radius:10px;padding:12px 14px}
.gsk-baslik{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  color:var(--muted);margin-bottom:8px}
.gsk-satir{display:flex;justify-content:space-between;align-items:center;gap:12px;
  padding:5px 0;font-size:12.5px;border-bottom:1px solid var(--line)}
.gsk-satir:last-child{border-bottom:none}
.gsk-satir>span{color:var(--muted)}
.gsk-satir>b{font-weight:600;text-align:right}
.gsk-firma{display:flex;align-items:center;gap:9px;flex-wrap:wrap;padding:7px 0;
  border-bottom:1px solid var(--line);font-size:13px}
.gsk-firma:last-child{border-bottom:none}
.gsk-firma a{color:var(--brand)}

/* ═══════════════ TOOLLAR · GÖRSEL STÜDYO ═══════════════ */
/* Ofis/belge işleri için (29 Eyl 2026). Açılışta görev kartları; görsel
   açılınca tek tuval + görev odaklı araç paneli. Stüdyo görünen alanın
   kalanını doldurur (yükseklik JS'te hesaplanır), panel kendi içinde kayar. */
.gv{--gv-r:12px}
/* Stüdyoda hidden her zaman gizler (bileşenlerin display kuralı onu ezmesin). */
.gv [hidden]{display:none!important}
.gv-bas{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;
  flex-wrap:wrap;margin-bottom:14px}
.gv-baslik{font-size:17px;font-weight:700;letter-spacing:-.01em}
.gv-alt-baslik{font-size:13px;color:var(--muted);margin-top:2px}
.gv-gizlilik{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 11px;
  border-radius:999px;background:var(--success-soft);color:#0b7a4c;font-size:12px;
  font-weight:600;cursor:default}
.gv-gizlilik svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.7;
  stroke-linecap:round;stroke-linejoin:round}

/* --- açılış --- */
.gv-acilis{background:var(--card);border:1px solid var(--line);border-radius:var(--gv-r);padding:22px}
.gv-birak{display:flex;flex-direction:column;align-items:center;text-align:center;gap:5px;
  padding:34px 20px;border:1.5px dashed #b9cde2;border-radius:12px;background:var(--bg);
  cursor:pointer;transition:border-color .15s,background .15s}
.gv-birak:hover,.gv-birak.surukle{border-color:var(--brand);background:var(--brand-soft)}
.gv-birak-ikon{width:48px;height:48px;border-radius:50%;background:var(--card);
  display:flex;align-items:center;justify-content:center;margin-bottom:6px;
  box-shadow:0 1px 2px rgba(15,49,86,.08),0 4px 12px rgba(15,49,86,.06)}
.gv-birak-ikon svg{width:24px;height:24px;fill:none;stroke:var(--brand);stroke-width:1.7;
  stroke-linecap:round;stroke-linejoin:round}
.gv-birak b{font-size:15px}
.gv-birak>span{font-size:13px;color:var(--muted)}
.gv-birak u{color:var(--brand);text-decoration:none;font-weight:600}
.gv-birak small{font-size:11.5px;color:var(--muted);margin-top:4px}
.gv-gorev-bas{font-size:13.5px;font-weight:700;margin:22px 0 10px}
.gv-gorev-bas span{font-weight:400;color:var(--muted);font-size:12.5px;margin-left:6px}
.gv-gorevler{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.gv-gorev{display:flex;flex-direction:column;align-items:flex-start;gap:5px;text-align:left;
  padding:16px;border:1px solid var(--line);border-radius:12px;background:var(--card);
  font:inherit;color:var(--ink);cursor:pointer;transition:border-color .15s,box-shadow .15s,transform .15s}
.gv-gorev:hover,.gv-gorev:focus-visible{border-color:var(--brand);outline:none;
  box-shadow:0 6px 18px rgba(18,116,197,.12);transform:translateY(-1px)}
.gv-gorev-ikon{width:36px;height:36px;border-radius:10px;background:var(--brand-soft);
  display:flex;align-items:center;justify-content:center;margin-bottom:6px}
.gv-gorev-ikon svg{width:19px;height:19px;fill:none;stroke:var(--brand);stroke-width:1.6;
  stroke-linecap:round;stroke-linejoin:round}
.gv-gorev b{font-size:14px}
.gv-gorev span{font-size:12.5px;color:var(--muted);line-height:1.5}
@media (max-width:1100px){.gv-gorevler{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.gv-acilis{padding:14px}.gv-gorevler{grid-template-columns:1fr}
  .gv-gorev{flex-direction:row;flex-wrap:wrap;align-items:center;column-gap:12px;padding:13px 14px}
  .gv-gorev-ikon{margin:0}.gv-gorev span{flex-basis:100%}}

/* --- düzenleyici --- */
.gv-duzen{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:14px;min-height:480px}
.gv-duzen[hidden]{display:none}
.gv-sol{display:flex;flex-direction:column;min-width:0;min-height:0;background:var(--card);
  border:1px solid var(--line);border-radius:var(--gv-r);overflow:hidden}
.gv-cubuk{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:8px 10px;
  border-bottom:1px solid var(--line)}
.gv-dgrup{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:8px;overflow:hidden}
.gv-dgrup .gv-ib{border:0;border-radius:0}
.gv-dgrup .gv-ib + .gv-ib,.gv-dgrup>*+*{border-left:1px solid var(--line)}
.gv-ib{height:30px;min-width:32px;padding:0 7px;display:inline-flex;align-items:center;
  justify-content:center;gap:6px;border:1px solid var(--line);border-radius:8px;
  background:var(--card);color:var(--ink);font:inherit;font-size:12.5px;font-weight:600;cursor:pointer}
.gv-ib svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.6;
  stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.gv-ib:hover:not(:disabled){background:var(--bg);color:var(--brand)}
.gv-ib:disabled{opacity:.4;cursor:not-allowed}
.gv-ib.is-basili{background:var(--brand-soft);color:var(--brand)}
.gv-ib-metin{padding:0 10px;user-select:none;-webkit-user-select:none;touch-action:none}
.gv-yakin-deger{height:30px;min-width:56px;border:0;background:var(--card);font:inherit;
  font-size:12px;font-weight:600;color:var(--ink);cursor:pointer;font-variant-numeric:tabular-nums}
.gv-yakin-deger:hover{color:var(--brand)}
.gv-bilgi{font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;flex:1 1 120px}
.gv-cubuk-sag{display:flex;align-items:center;gap:6px;margin-left:auto}
.gv-cubuk-sag label.btn{cursor:pointer;margin:0}

.gv-sahne{position:relative;flex:1;min-height:300px;display:flex;overflow:hidden;
  background-color:#eef2f6;
  background-image:
    linear-gradient(45deg,rgba(128,128,128,.12) 25%,transparent 25%),
    linear-gradient(-45deg,rgba(128,128,128,.12) 25%,transparent 25%),
    linear-gradient(45deg,transparent 75%,rgba(128,128,128,.12) 75%),
    linear-gradient(-45deg,transparent 75%,rgba(128,128,128,.12) 75%);
  background-size:18px 18px;background-position:0 0,0 9px,9px -9px,-9px 0}
.gv-sahne.surukle{outline:2px dashed var(--brand);outline-offset:-8px}
.gv-kaydir{flex:1;overflow:auto;display:flex;padding:24px}
.gv-kat{position:relative;margin:auto;flex-shrink:0}
.gv-kat.kipte{touch-action:none}
.gv-kat canvas{display:block;width:100%;height:100%;box-shadow:0 8px 26px rgba(15,49,86,.18);
  border-radius:2px}
.gv-kat.tiklama canvas{cursor:crosshair}
.gv-once-rozet{position:absolute;left:14px;bottom:14px;background:var(--navy);color:#fff;
  font-size:11.5px;font-weight:600;padding:4px 10px;border-radius:999px;pointer-events:none}
.gv-mesgul{position:absolute;inset:0;z-index:4;display:flex;align-items:center;justify-content:center;
  gap:10px;background:rgba(255,255,255,.72);font-size:13px;font-weight:600;color:var(--ink)}
.gv-mesgul[hidden],.gv-once-rozet[hidden],.gv-yonerge[hidden]{display:none}

/* Tuval kipi yönergesi: kırpma, köşe, tıklama kiplerinde ne yapılacağını
   ve nasıl bitirileceğini söyler. */
.gv-yonerge{display:flex;align-items:center;gap:10px;padding:7px 10px 7px 14px;
  background:var(--brand-soft);border-bottom:1px solid #cfe2f5;font-size:12.5px;color:var(--ink)}
.gv-yonerge-ikon svg{width:16px;height:16px;fill:none;stroke:var(--brand);stroke-width:1.7;
  stroke-linecap:round;display:block}
.gv-yonerge-metin{line-height:1.4;flex:1;min-width:0}
.gv-yonerge-dugme{display:flex;gap:6px;flex-shrink:0}

/* Kırpma çerçevesi */
.gv-kirp{position:absolute;box-shadow:0 0 0 9999px rgba(15,49,86,.5);outline:1.5px solid #fff;
  cursor:move;background-image:
    linear-gradient(to right,rgba(255,255,255,.45) 1px,transparent 1px),
    linear-gradient(to bottom,rgba(255,255,255,.45) 1px,transparent 1px);
  background-size:33.333% 33.333%;background-position:33.333% 33.333%}
.gv-kat:has(.gv-kirp:not([hidden])){overflow:hidden}
.gv-kirp[hidden],.gv-kose[hidden]{display:none}
.gv-kirp i{position:absolute;width:14px;height:14px;background:#fff;border:1.5px solid var(--brand);
  border-radius:3px;margin:-7px 0 0 -7px}
.gv-kirp i[data-tut="nw"]{left:0;top:0;cursor:nwse-resize}
.gv-kirp i[data-tut="n"]{left:50%;top:0;cursor:ns-resize}
.gv-kirp i[data-tut="ne"]{left:100%;top:0;cursor:nesw-resize}
.gv-kirp i[data-tut="e"]{left:100%;top:50%;cursor:ew-resize}
.gv-kirp i[data-tut="se"]{left:100%;top:100%;cursor:nwse-resize}
.gv-kirp i[data-tut="s"]{left:50%;top:100%;cursor:ns-resize}
.gv-kirp i[data-tut="sw"]{left:0;top:100%;cursor:nesw-resize}
.gv-kirp i[data-tut="w"]{left:0;top:50%;cursor:ew-resize}
.gv-kirp-olcu{position:absolute;left:50%;bottom:8px;transform:translateX(-50%);white-space:nowrap;
  background:rgba(15,49,86,.85);color:#fff;font-size:11px;font-weight:600;padding:2px 8px;
  border-radius:999px;font-variant-numeric:tabular-nums;pointer-events:none}

/* Perspektif köşeleri */
.gv-kose{position:absolute;inset:0}
.gv-kose svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.gv-kose polygon{fill:rgba(18,116,197,.14);stroke:#fff;stroke-width:2.5;vector-effect:non-scaling-stroke}
.gv-kose i{position:absolute;width:26px;height:26px;margin:-13px 0 0 -13px;border-radius:50%;
  background:rgba(255,255,255,.3);border:2.5px solid #fff;box-shadow:0 0 0 1.5px var(--brand),0 2px 8px rgba(0,0,0,.3);
  cursor:grab;touch-action:none}
.gv-kose i::after{content:"";position:absolute;left:50%;top:50%;width:6px;height:6px;margin:-3px 0 0 -3px;
  border-radius:50%;background:var(--brand)}
.gv-kose i:active{cursor:grabbing}

/* --- panel --- */
.gv-panel{display:flex;flex-direction:column;min-height:0;background:var(--card);
  border:1px solid var(--line);border-radius:var(--gv-r);overflow:hidden}
.gv-araclar{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;padding:8px;
  border-bottom:1px solid var(--line);background:var(--bg)}
.gv-arac{display:flex;align-items:center;gap:7px;height:36px;padding:0 9px;border:1px solid transparent;
  border-radius:8px;background:none;font:inherit;font-size:12px;font-weight:600;color:var(--muted);
  cursor:pointer;text-align:left;line-height:1.15;min-width:0}
.gv-arac svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.6;
  stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.gv-arac span{overflow:hidden;text-overflow:ellipsis}
.gv-arac:hover{background:var(--card);color:var(--ink)}
.gv-arac.is-on{background:var(--card);color:var(--brand);border-color:var(--line);
  box-shadow:0 1px 2px rgba(15,49,86,.08)}
.gv-govde{flex:1;min-height:0;overflow-y:auto}
.gv-bolum{display:none}
.gv-bolum.is-on{display:block}
.gv-islem{padding:14px 16px;border-bottom:1px solid var(--line)}
.gv-islem:last-child{border-bottom:0}
.gv-islem-bas{margin-bottom:10px}
.gv-islem-bas b{display:block;font-size:13px;font-weight:650}
.gv-islem-bas span{display:block;font-size:12px;color:var(--muted);line-height:1.45;margin-top:2px}
.gv-islem-bas-yan{display:flex;align-items:center;justify-content:space-between;gap:8px}
.gv-islem-bas-yan b{display:inline}
.gv-tam{width:100%;justify-content:center}
.gv-not{margin:10px 0 0;font-size:11.5px;color:var(--muted);line-height:1.5}
.gv-baglanti{background:none;border:0;padding:0;font:inherit;font-size:12px;font-weight:600;
  color:var(--brand);cursor:pointer}
.gv-baglanti:hover{text-decoration:underline}
.gv-not .gv-baglanti{font-size:11.5px}

.gv-cipler{display:flex;gap:5px;flex-wrap:wrap;margin-bottom:10px}
.gv-cipler button{height:28px;padding:0 10px;border:1px solid var(--line);border-radius:999px;
  background:var(--card);font:inherit;font-size:12px;font-weight:600;color:var(--ink);cursor:pointer}
.gv-cipler button:hover{border-color:var(--brand);color:var(--brand)}
.gv-cipler button.is-on{background:var(--brand);border-color:var(--brand);color:#fff}

.gv-kaydirac{display:flex;align-items:center;gap:10px}
.gv-kaydirac input{flex:1}
.gv-kaydirac output,.gv-ayar output{min-width:40px;text-align:right;font-size:12px;font-weight:600;
  font-variant-numeric:tabular-nums}
.gv input[type=range]{accent-color:var(--brand);height:18px;cursor:pointer}
.gv-ayar{display:grid;grid-template-columns:104px minmax(0,1fr) 40px;align-items:center;gap:8px;margin-top:6px}
.gv-ayar label{font-size:12.5px;color:var(--ink);display:flex;align-items:center;gap:4px}
.gv-ayar input{width:100%}

.gv-dortlu{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.gv-dortlu button{display:flex;align-items:center;gap:7px;height:34px;padding:0 10px;
  border:1px solid var(--line);border-radius:8px;background:var(--card);font:inherit;font-size:12.5px;
  font-weight:600;color:var(--ink);cursor:pointer}
.gv-dortlu button:hover{border-color:var(--brand);color:var(--brand)}
.gv-dortlu svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.6;
  stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}

.gv-hazirlar{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.gv-hazirlar button{display:flex;flex-direction:column;gap:5px;padding:4px 4px 6px;border:1px solid var(--line);
  border-radius:9px;background:var(--card);font:inherit;font-size:11.5px;font-weight:600;color:var(--ink);cursor:pointer}
.gv-hazirlar canvas{width:100%;aspect-ratio:84/64;border-radius:6px;background:#eef2f6;display:block}
.gv-hazirlar button:hover{border-color:var(--brand)}
.gv-hazirlar button.is-on{border-color:var(--brand);box-shadow:0 0 0 2px var(--brand-soft);color:var(--brand)}

.gv-secmeli{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:10px}
.gv-secmeli button{display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:8px 10px;
  border:1px solid var(--line);border-radius:9px;background:var(--card);font:inherit;font-size:12.5px;
  font-weight:650;color:var(--ink);cursor:pointer;text-align:left}
.gv-secmeli small{font-size:11px;font-weight:500;color:var(--muted);line-height:1.35}
.gv-secmeli button:hover{border-color:var(--brand)}
.gv-secmeli button.is-on{border-color:var(--brand);background:var(--brand-soft)}
.gv-ikili{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:12px}
.gv-ikili .btn{justify-content:center}
.gv-onay{display:flex;align-items:center;gap:7px;font-size:12.5px;cursor:pointer;margin-bottom:4px}
.gv-onay input{accent-color:var(--brand);width:15px;height:15px}

.gv-renkler{display:flex;gap:7px;flex-wrap:wrap;align-items:center}
.gv-renkler button,.gv-renk-ozel{width:30px;height:30px;padding:3px;border:1px solid var(--line);
  border-radius:8px;background:var(--card);cursor:pointer;display:block;position:relative}
.gv-renkler button i{display:block;width:100%;height:100%;border-radius:5px;box-shadow:inset 0 0 0 1px rgba(15,49,86,.12)}
.gv-renkler button.is-on,.gv-renk-ozel.is-on{border-color:var(--brand);box-shadow:0 0 0 2px var(--brand-soft)}
.gv-renkler i.saydam{background-color:#fff;background-image:
  linear-gradient(45deg,#c3ccd6 25%,transparent 25%),linear-gradient(-45deg,#c3ccd6 25%,transparent 25%),
  linear-gradient(45deg,transparent 75%,#c3ccd6 75%),linear-gradient(-45deg,transparent 75%,#c3ccd6 75%);
  background-size:8px 8px;background-position:0 0,0 4px,4px -4px,-4px 0}
.gv-renk-ozel{background:conic-gradient(#f43f5e,#f59e0b,#84cc16,#06b6d4,#6366f1,#d946ef,#f43f5e);padding:0}
.gv-renk-ozel input{position:absolute;inset:0;opacity:0;width:100%;height:100%;cursor:pointer}

.gv-olcu-kutu{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;padding:12px 16px;
  background:var(--bg);border-bottom:1px solid var(--line);font-size:12px;color:var(--muted)}
.gv-olcu-kutu b{font-size:14px;color:var(--ink);font-variant-numeric:tabular-nums}
.gv-olcu-kutu small{font-size:11.5px}
.gv-hazir-olcu{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.gv-hazir-olcu button{display:flex;flex-direction:column;align-items:flex-start;gap:1px;padding:8px 10px;
  border:1px solid var(--line);border-radius:9px;background:var(--card);font:inherit;cursor:pointer;text-align:left}
.gv-hazir-olcu b{font-size:12.5px;color:var(--ink)}
.gv-hazir-olcu span{font-size:11px;color:var(--muted);font-variant-numeric:tabular-nums}
.gv-hazir-olcu button:hover{border-color:var(--brand)}
.gv-hazir-olcu button.is-on{border-color:var(--brand);background:var(--brand-soft)}
.gv-olcu-giris{display:grid;grid-template-columns:1fr 34px 1fr;gap:6px;align-items:end}
.gv-olcu-giris label{display:flex;flex-direction:column;gap:4px;font-size:11.5px;color:var(--muted)}
.gv-olcu-giris .input{height:34px;font-variant-numeric:tabular-nums}
.gv-kilit{height:34px;border:1px solid var(--line);border-radius:8px;background:var(--card);
  color:var(--muted);cursor:pointer;display:flex;align-items:center;justify-content:center}
.gv-kilit svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round}
.gv-kilit.is-on{color:var(--brand);border-color:var(--brand);background:var(--brand-soft)}
.gv-kilit:not(.is-on) svg path{transform:translate(3px,-1.5px)}
.gv-yerlesim{margin-top:12px}
.gv-yerlesim[hidden]{display:none}
.gv-olcu-sonuc{font-size:12px;color:var(--muted);margin:10px 0;min-height:17px;font-variant-numeric:tabular-nums}
.gv-olcu-sonuc b{color:var(--ink)}

.gv-logo-sec{display:flex;align-items:center;gap:8px;margin-top:2px;padding:8px 10px;
  border:1px dashed var(--line);border-radius:9px;font-size:12.5px;color:var(--brand);font-weight:600;cursor:pointer}
.gv-logo-sec:hover{border-color:var(--brand);background:var(--brand-soft)}
.gv-logo-sec svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.6;
  stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.gv-cipler-sar{margin-top:8px}
.gv-konum{display:grid;grid-template-columns:repeat(3,30px);grid-template-rows:repeat(3,24px);gap:4px;
  padding:6px;border:1px solid var(--line);border-radius:9px;width:max-content;background:var(--bg)}
.gv-konum[hidden]{display:none}
.gv-konum button{border:1px solid var(--line);border-radius:5px;background:var(--card);cursor:pointer;padding:0}
.gv-konum button:hover{border-color:var(--brand)}
.gv-konum button.is-on{background:var(--brand);border-color:var(--brand)}
#gv-fil-renk{margin-bottom:6px}

/* --- indir penceresi --- */
.gv-kaydet .radio-card b{font-size:13px}
.gv-bicimler{flex-direction:row;margin-bottom:16px}
.gv-bicimler .radio-card{flex:1;min-width:0}
.gv-kaydet-satir{display:grid;grid-template-columns:110px minmax(0,1fr);gap:10px;align-items:center;margin-bottom:12px}
.gv-kaydet-satir[hidden]{display:none}
.gv-kaydet-et{font-size:12.5px;color:var(--muted);display:flex;align-items:center;gap:4px}
.gv-kaydet-satir .gv-cipler{margin:0}
.gv-sinir-ozel{display:inline-flex;align-items:center;gap:5px;font-size:12px;color:var(--muted)}
.gv-sinir-ozel .input{width:82px;height:28px;font-size:12px;border-radius:999px;padding:0 10px}
.gv-cipler.is-kapali{opacity:.45;pointer-events:none}
.gv-dosya-adi{display:flex;align-items:center;border:1px solid var(--line);border-radius:8px;overflow:hidden;background:var(--card)}
.gv-dosya-adi .input{border:0;border-radius:0;flex:1;min-width:0}
.gv-dosya-adi span{padding:0 11px;font-size:12.5px;color:var(--muted);background:var(--bg);align-self:stretch;
  display:flex;align-items:center;border-left:1px solid var(--line)}
.gv-tahmin{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:11px 13px;border-radius:9px;
  background:var(--bg);font-size:12.5px;color:var(--muted);margin:4px 0 18px;min-height:42px}
.gv-tahmin b{color:var(--ink);font-variant-numeric:tabular-nums}
.gv-tahmin.uyari{background:var(--warning-soft);color:var(--warning)}
.gv-tahmin .gv-uyari{flex-basis:100%;color:var(--warning);font-size:12px}
.gv-kaydet-dugme{align-items:center}
.gv-pano{margin-right:auto}

@media (max-width:1100px){
  .gv-duzen{grid-template-columns:1fr;min-height:0}
  .gv-sahne{min-height:52vh}
  .gv-panel{max-height:none}
  .gv-araclar{grid-template-columns:repeat(6,minmax(0,1fr))}
  .gv-arac{flex-direction:column;justify-content:center;gap:3px;height:50px;padding:0 2px;font-size:10.5px;text-align:center}
  .gv-arac span{white-space:normal}
}
@media (max-width:600px){
  .gv-kaydir{padding:12px}
  .gv-cubuk{gap:6px}
  .gv-ib-metin span,.gv-yeni span{display:none}
  .gv-bilgi{order:9;flex-basis:100%}
  .gv-yonerge{flex-wrap:wrap}
  .gv-yonerge-dugme{margin-left:auto}
  .gv-bicimler{flex-direction:column}
  .gv-kaydet-satir{grid-template-columns:1fr;gap:6px}
  .gv-pano{margin-right:0;width:100%;justify-content:center}
  .gv-kaydet-dugme{flex-wrap:wrap}
  .gv-kaydet-dugme .btn:not(.gv-pano){flex:1;justify-content:center}
  .gv-ayar{grid-template-columns:92px minmax(0,1fr) 38px}
}

/* Görev rehberi: açılışta seçilen işin adımları; adıma tıklamak aracı açar. */
.gv-rehber{padding:12px 14px;border-bottom:1px solid var(--line);background:linear-gradient(180deg,var(--brand-soft),var(--card))}
.gv-rehber[hidden]{display:none}
.gv-rehber-bas{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.gv-rehber-bas b{font-size:12.5px;font-weight:700;color:var(--brand)}
.gv-rehber-kapat{width:24px;height:24px;border:0;background:none;border-radius:6px;cursor:pointer;color:var(--muted);
  display:flex;align-items:center;justify-content:center}
.gv-rehber-kapat:hover{background:var(--card);color:var(--ink)}
.gv-rehber-kapat svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
.gv-rehber-adim{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px;counter-reset:adim}
.gv-rehber-adim button{display:flex;align-items:center;gap:9px;width:100%;padding:6px 8px;border:1px solid transparent;
  border-radius:8px;background:none;font:inherit;font-size:12.5px;color:var(--ink);cursor:pointer;text-align:left;
  counter-increment:adim}
.gv-rehber-adim button::before{content:counter(adim);width:20px;height:20px;border-radius:50%;flex-shrink:0;
  background:var(--card);border:1px solid var(--line);color:var(--muted);font-size:11px;font-weight:700;
  display:flex;align-items:center;justify-content:center}
.gv-rehber-adim button:hover{background:var(--card)}
.gv-rehber-adim button.is-on{background:var(--card);border-color:var(--line);font-weight:600}
.gv-rehber-adim button.is-on::before{background:var(--brand);border-color:var(--brand);color:#fff}
.gv-rehber-adim button.is-tamam::before{content:"✓";background:var(--success);border-color:var(--success);color:#fff}
.gv-rehber-adim button.is-tamam{color:var(--muted)}
/* Eğim ayarlarken hizalama ızgarası */
.gv-kat.izgara::after{content:"";position:absolute;inset:0;pointer-events:none;
  background-image:linear-gradient(to right,rgba(18,116,197,.35) 1px,transparent 1px),
    linear-gradient(to bottom,rgba(18,116,197,.35) 1px,transparent 1px);
  background-size:40px 40px}
@media (max-width:1100px){.gv-sahne{flex:none;height:56vh;min-height:320px}}
.gv-kaydir{min-width:0;min-height:0}

/* Onay kutusu satırı: eski stüdyodan kalan ad; ajanda ve rapor formları kullanıyor. */
.gsp-onay{display:flex;align-items:center;gap:7px;font-size:12px;margin-bottom:10px;cursor:pointer}

/* ═══════════════ TOOLLAR · NOT DEFTERİ ═══════════════ */
.not-etiketler{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-bottom:16px}
.not-etiketler>span{font-size:11px;font-weight:700;letter-spacing:.06em;
  text-transform:uppercase;color:var(--muted)}
/* Sayaç etikete bitişik yazılınca "#fatura1" gibi okunuyordu. */
.not-etiketler .chip b{
  margin-left:6px;padding:0 5px;border-radius:999px;
  background:var(--line);color:var(--muted);font-size:10.5px;font-weight:700;
  font-variant-numeric:tabular-nums;
}
.not-etiketler .chip.chip-on b{background:rgba(255,255,255,.24)}

.not-izgara{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}
.not-kart{
  background:var(--card);border:1px solid var(--line);border-left:3px solid var(--line);
  border-radius:12px;padding:14px 16px;display:flex;flex-direction:column;gap:9px;
}
.not-kart.sabit{box-shadow:0 2px 10px rgba(0,0,0,.07)}
.not-kart.nr-notr{border-left-color:var(--line)}
.not-kart.nr-sari{border-left-color:var(--warning)}
.not-kart.nr-yesil{border-left-color:var(--success)}
.not-kart.nr-kirmizi{border-left-color:var(--danger)}
.not-kart.nr-mavi{border-left-color:var(--brand)}
.not-kart.nr-mor{border-left-color:var(--purple)}
.not-kart header{display:flex;flex-direction:column;gap:6px}
.nk-ust{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.nk-kategori{font-size:11.5px;color:var(--muted)}
.nk-sabit{margin-left:auto;color:var(--warning);display:flex}
.nk-sabit svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.7;
  stroke-linecap:round;stroke-linejoin:round}
.not-kart h3{margin:0;font-size:14.5px;font-weight:650;line-height:1.35}
.nk-icerik{margin:0;font-size:12.5px;line-height:1.55;color:var(--ink);
  white-space:pre-wrap;word-break:break-word}
.nk-etiket{display:flex;gap:5px;flex-wrap:wrap}
.not-kart footer{margin-top:auto;padding-top:9px;border-top:1px solid var(--line);
  display:flex;flex-direction:column;gap:8px}
.nk-meta{display:flex;flex-direction:column;gap:2px;font-size:11.5px;color:var(--muted)}
.nk-firma{color:var(--brand);font-weight:600}
.nk-islem{display:flex;gap:4px;flex-wrap:wrap}

.not-renkler{display:flex;gap:8px;flex-wrap:wrap}
.not-renkler label{cursor:pointer;display:block}
.not-renkler input{position:absolute;opacity:0;pointer-events:none}
.not-renkler span{display:block;width:28px;height:28px;border-radius:8px;
  border:1px solid var(--line)}
.not-renkler input:checked + span{box-shadow:0 0 0 2px var(--brand)}
.not-renkler .nr-notr{background:var(--bg)}
.not-renkler .nr-sari{background:var(--warning)}
.not-renkler .nr-yesil{background:var(--success)}
.not-renkler .nr-kirmizi{background:var(--danger)}
.not-renkler .nr-mavi{background:var(--brand)}
.not-renkler .nr-mor{background:var(--purple)}

/* ═══════════════ RAPORLAR · KATALOG ═══════════════ */
/* Rapor listesi bir menü değil, bir soru listesidir: kart üzerindeki soru,
   "hangi rapora bakmalıyım" kararını ekranın kendisinden okunur kılar. */
.rp-birimler{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:16px}
.rp-birim{
  font-size:12.5px;font-weight:600;padding:7px 14px;border-radius:999px;
  border:1px solid var(--line);background:var(--card);color:var(--ink);
}
.rp-birim:hover{border-color:var(--brand);color:var(--brand)}
.rp-birim.is-on{background:var(--brand);border-color:var(--brand);color:#fff}

.rp-izgara{display:grid;gap:13px;grid-template-columns:repeat(auto-fill,minmax(330px,1fr))}
.rp-kart{
  display:flex;flex-direction:column;gap:8px;
  background:var(--card);border:1px solid var(--line);border-radius:12px;
  padding:16px 18px;color:inherit;transition:border-color .15s,box-shadow .15s;
}
.rp-kart:hover{border-color:var(--brand);box-shadow:0 4px 14px rgba(0,0,0,.07)}
.rpk-ust{display:flex;align-items:center;gap:8px}
.rpk-birim{
  font-size:10.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  color:var(--brand);background:var(--brand-soft);border-radius:5px;padding:2px 7px;
}
.rpk-donem{
  margin-left:auto;font-size:10.5px;font-weight:600;color:var(--muted);
  border:1px solid var(--line);border-radius:5px;padding:1px 7px;
}
.rp-kart h3{margin:0;font-size:15px;font-weight:650;line-height:1.3}
.rpk-ozet{margin:0;font-size:12.5px;line-height:1.55;color:var(--muted)}
.rpk-soru{
  display:flex;gap:8px;align-items:flex-start;margin-top:2px;padding:9px 11px;
  background:var(--bg);border-radius:8px;font-size:12px;line-height:1.5;
}
.rpk-soru svg{width:15px;height:15px;flex-shrink:0;margin-top:1px;
  fill:none;stroke:var(--brand);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.rpk-git{
  margin-top:auto;padding-top:4px;display:inline-flex;align-items:center;gap:5px;
  font-size:12.5px;font-weight:600;color:var(--brand);
}
.rpk-git svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2;
  stroke-linecap:round;stroke-linejoin:round}

/* ═══════════════ RAPORLAR · DETAY ═══════════════ */
.rp-baslik .back-link{margin-bottom:10px}
.rp-soru-serit{
  display:flex;gap:10px;align-items:flex-start;margin-bottom:16px;
  padding:12px 15px;border-radius:10px;
  background:var(--brand-soft);border-left:3px solid var(--brand);
  font-size:13px;line-height:1.55;
}
.rp-soru-serit svg{width:17px;height:17px;flex-shrink:0;margin-top:1px;
  fill:none;stroke:var(--brand);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}

.rp-arac{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:16px}
.rp-donem{display:flex;gap:5px;flex-wrap:wrap}
.rp-donem-btn{
  font-size:12px;font-weight:600;padding:6px 12px;border-radius:999px;cursor:pointer;
  border:1px solid var(--line);background:var(--card);color:var(--ink);
}
.rp-donem-btn:hover{border-color:var(--brand);color:var(--brand)}
.rp-donem-btn.is-on{background:var(--brand);border-color:var(--brand);color:#fff}
.rp-ozel{display:flex;align-items:center;gap:6px}
.rp-ozel.rp-kapali{display:none}
.rp-ozel .input{height:32px;width:145px;font-size:12.5px}
.rp-ozel span{color:var(--muted)}
.rp-aralik{font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}
.rp-aralik.rp-anlik{display:inline-flex;align-items:center;gap:6px}
.rp-aralik svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.6;
  stroke-linecap:round;stroke-linejoin:round}
.rp-indir{margin-left:auto}
.rp-indir svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.7;
  stroke-linecap:round;stroke-linejoin:round}

/* Grafik etiketi rapora göre uzayabiliyor; sabit 120px'e sığmıyordu. */
.db-ad.rp-db-ad{width:210px;white-space:normal;line-height:1.35}

.mini-table .td-sag{text-align:right}
.rp-tablo td{font-variant-numeric:tabular-nums}
.rp-tablo td:first-child{font-variant-numeric:normal}
.v-iyi{color:var(--success);font-weight:600}
.v-uyari{color:var(--warning);font-weight:600}
.v-kotu{color:var(--danger);font-weight:600}
.kpi-value.v-iyi{color:var(--success)}
.kpi-value.v-uyari{color:var(--warning)}
.kpi-value.v-kotu{color:var(--danger)}

/* Yöntem notu: sayının nasıl bulunduğu, sayının kendisi kadar önemlidir. */
.rp-yontem{
  margin-top:16px;padding:13px 16px;border-radius:10px;
  background:var(--bg);border:1px solid var(--line);
}
.rpy-baslik{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  color:var(--muted);margin-bottom:5px}
.rp-yontem p{margin:0;font-size:12.5px;line-height:1.6;color:var(--ink)}

/* Erişim ekranındaki birim açıklamaları */
.rp-birim-anlat{margin-top:14px;padding-top:12px;border-top:1px solid var(--line);
  display:grid;gap:7px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.rba-satir{display:flex;gap:8px;align-items:baseline}
.rba-ad{font-size:12px;font-weight:650;white-space:nowrap;color:var(--brand)}
.rba-satir p{margin:0;font-size:11.5px;line-height:1.5;color:var(--muted)}

/* ═══════════════ RAPOR GRAFİKLERİ (satır içi SVG) ═══════════════ */
.rg-tuval{padding:6px 2px 2px}
.rg-svg{width:100%;display:block}
.rg-kilavuz{stroke:var(--line);stroke-width:1}
.rg-eksen{fill:var(--muted);font-size:11px;font-family:inherit}
.rg-cizgi{fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.rg-nokta{stroke:var(--card);stroke-width:1.5}
.rg-hedef{fill:transparent;cursor:default}
.rg-hedef:hover{fill:currentColor;fill-opacity:.06}
.rg-sutun{transition:opacity .12s}
.rg-sutun:hover{opacity:.82}
.rg-halka{width:200px;height:200px;flex-shrink:0}
.rg-halka-dilim{stroke:var(--card);stroke-width:2;transition:opacity .12s}
.rg-halka-dilim:hover{opacity:.85}
.rg-halka-ust{fill:var(--ink);font-size:19px;font-weight:700}
.rg-halka-alt{fill:var(--muted);font-size:11px}
.rg-kivilcim{width:100%;height:30px;display:block}
/* Kıvılcımlar kart genişliğini doldursun diye yatay esnetiliyor (içlerinde
   yazı yok, sorun değil) — ama esneme çizgi kalınlığını da bozuyordu: yatay
   parçalar kalın, dik parçalar ince çıkıyordu. non-scaling-stroke kalınlığı
   ekran pikseline sabitler. */
.rg-kivilcim path,.kpi-kivrim polyline{vector-effect:non-scaling-stroke}
/* Isı haritası: satır sayısı değişken olduğu için yükseklik sabitlenmez. */
.rg-isi{width:100%;height:auto;display:block;overflow:visible}
/* Hedef–gerçekleşen (bullet): çubuk gerçekleşen, dikey çizgi hedeftir. */
.rg-hedefbar{width:100%;height:auto;display:block}
.rg-hedef-ad{fill:var(--ink);font-size:12.5px;font-weight:600}
.rg-hedef-deger{font-size:13px;font-weight:700;font-variant-numeric:tabular-nums}
.rg-hedef-zemin{fill:var(--bg);stroke:var(--line);stroke-width:1}
.rg-hedef-cubuk{animation:rg-yayil .5s ease-out both}
.rg-hedef-cizgi{stroke:var(--ink);stroke-width:2;stroke-linecap:round;opacity:.65}
.rg-hedef-etiket{fill:var(--muted);font-size:11px}

/* Huni: dilim yüksekliği sabit, sayı satır sayısıyla değişir. */
.rg-huni{width:100%;height:auto;display:block}
.rg-huni-dilim{transition:opacity .12s}
.rg-huni-dilim:hover{opacity:.88}
.rg-huni-ad{fill:#fff;font-size:13px;font-weight:650}
.rg-huni-deger{fill:#fff;font-size:11.5px;opacity:.9;font-variant-numeric:tabular-nums}
.rg-huni-gecis{fill:var(--muted);font-size:11.5px;font-weight:650}
.rg-isi-baslik{fill:var(--muted);font-size:11.5px;font-weight:650}
.rg-isi-satir{fill:var(--ink);font-size:12px;font-weight:600}
.rg-isi-alt{fill:var(--muted);font-size:10.5px}
.rg-isi-deger{font-size:12.5px;font-weight:700;font-variant-numeric:tabular-nums}
.rg-isi-goz{transition:opacity .12s}
.rg-isi-goz:hover{opacity:.85}
.rg-isi-bos{fill:var(--bg);stroke:var(--line);stroke-width:1;stroke-dasharray:3 3}
/* Serinin SON noktası: grafiğe bakan önce "şu an nerede" sorusunu sorar. */
.rg-nokta-son{stroke-width:2}
.rg-son-deger{font-size:12px;font-weight:700;font-variant-numeric:tabular-nums}
.rg-sutun-deger{fill:var(--muted);font-size:10.5px;font-weight:650;
  font-variant-numeric:tabular-nums}
.rg-yorum{margin:8px 2px 0;font-size:12.5px;line-height:1.55;color:var(--muted)}
.rg-legend{display:flex;gap:16px;flex-wrap:wrap;margin-top:8px;padding-left:2px;
  font-size:11.5px;color:var(--muted)}
.rg-legend span{display:inline-flex;align-items:center;gap:6px}
.rg-legend i,.rs-halka-legend i{width:10px;height:10px;border-radius:3px;flex-shrink:0;display:inline-block}
.lg-brand{background:var(--brand)}   .lg-accent{background:var(--accent)}
.lg-success{background:var(--success)} .lg-warning{background:var(--warning)}
.lg-danger{background:var(--danger)} .lg-purple{background:var(--purple)}
.lg-muted{background:var(--muted)}

/* ═══════════════ SATIŞ PERFORMANS RAPORU ═══════════════ */
.rs-ust{display:flex;align-items:flex-start;gap:16px;margin-bottom:14px;flex-wrap:wrap}
.rs-kimlik{flex:1;min-width:280px}
.rs-kimlik h1{margin:8px 0 4px;font-size:24px;font-weight:700;letter-spacing:-.02em}
.rs-kimlik p{margin:0;font-size:13px;color:var(--muted);line-height:1.55}
.rs-aksiyon{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding-top:26px}
.rs-yildiz svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.6;
  stroke-linejoin:round}
.rs-yildiz.is-on{color:var(--warning)}
.rs-yildiz.is-on svg{fill:var(--warning);stroke:var(--warning)}

/* Konum çubuğu — kullanıcı detaya indikçe nerede olduğunu kaybetmesin. */
.rs-kirinti{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-bottom:12px;
  font-size:12.5px;color:var(--muted)}
.rs-kirinti a{color:var(--brand);font-weight:600}
.rs-kirinti span{font-weight:600;color:var(--ink)}
.rs-kirinti svg{width:13px;height:13px;fill:none;stroke:var(--muted);stroke-width:1.6;
  stroke-linecap:round;stroke-linejoin:round}

/* Yatay, sade filtre şeridi — ekranı kaplayan ERP filtre paneli değil. */
.rs-arac{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:12px}
.rs-donem{display:flex;gap:4px;flex-wrap:wrap}
.rs-chip{font-size:12px;font-weight:600;padding:6px 11px;border-radius:8px;cursor:pointer;
  border:1px solid var(--line);background:var(--card);color:var(--ink)}
.rs-chip:hover{border-color:var(--brand);color:var(--brand)}
.rs-chip.is-on{background:var(--brand);border-color:var(--brand);color:#fff}
.rs-ozel{display:flex;align-items:center;gap:6px}
.rs-ozel.rs-kapali{display:none}
.rs-ozel .input{height:32px;width:142px;font-size:12.5px}
.rs-suzgec{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
/* Çoklu süzgeç: seçim listesi <details> içinde açılır. Yerel <select multiple>
   ctrl-tık gerektirdiği için elverişsiz; kutucuk listesi ne seçildiğini de
   doğrudan gösteriyor. */
/* Açılan panel sonraki kartların altında kalıyordu: araç çubuğu kendi yığılma
   bağlamını kurup üste çıkar. */
.rs-arac{position:relative;z-index:5}
.rs-coklu{position:relative}
.rs-coklu>summary{height:36px;box-sizing:border-box;display:inline-flex;align-items:center;
  gap:6px;border:1px solid var(--line);border-radius:8px;background:var(--card);
  padding:0 10px 0 12px;font-size:13px;color:var(--ink);cursor:pointer;list-style:none;
  white-space:nowrap}
.rs-coklu>summary::-webkit-details-marker{display:none}
.rs-coklu>summary b{font-weight:650}
.rs-coklu>summary svg{width:16px;height:16px;fill:none;stroke:var(--muted);stroke-width:1.5;
  stroke-linecap:round;stroke-linejoin:round;transition:transform .15s}
.rs-coklu[open]>summary{border-color:var(--brand);box-shadow:0 0 0 3px rgba(37,99,235,.10)}
.rs-coklu[open]>summary svg{transform:rotate(180deg)}
.rs-coklu-panel{position:absolute;z-index:40;top:calc(100% + 6px);left:0;min-width:250px;
  background:var(--card);border:1px solid var(--line);border-radius:10px;
  box-shadow:0 10px 28px rgba(15,32,55,.14);padding:6px}
.rs-coklu-liste{max-height:264px;overflow-y:auto}
.rs-coklu-liste label{display:flex;align-items:center;gap:9px;padding:7px 9px;border-radius:7px;
  font-size:13px;color:var(--ink);cursor:pointer}
.rs-coklu-liste label:hover{background:var(--bg-soft,#f4f7fb)}
.rs-coklu-liste input{width:15px;height:15px;accent-color:var(--brand);flex-shrink:0}
.rs-coklu-bos{margin:0;padding:10px;font-size:12px;color:var(--muted)}
/* Uygula düğmesi listenin altına sabitlenir: uzun listede kaydırıp geri dönmek
   gerekmesin. */
.rs-coklu-alt{padding:6px 0 0;border-top:1px solid var(--line);margin-top:6px}
.rs-coklu-alt button{width:100%;height:32px;border:none;border-radius:7px;
  background:var(--brand);color:#fff;font-family:inherit;font-size:12.5px;font-weight:600;
  cursor:pointer}
.rs-coklu-alt button:hover{filter:brightness(1.06)}
.rs-dahafazla{font-size:12px;font-weight:600;color:var(--brand);background:none;
  border:none;cursor:pointer;padding:6px 2px}
.rs-fazla{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.rs-fazla[hidden]{display:none}
.rs-aralik{margin-left:auto;display:inline-flex;align-items:center;gap:6px;
  font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}
/* Stilsiz kalan ikon varsayılan boyutta ve dolu siyah çiziliyordu. */
.rs-aralik svg{width:14px;height:14px;flex-shrink:0;fill:none;stroke:currentColor;
  stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}

.rs-rozetler{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-bottom:12px}
.rs-rozetler>span{font-size:11px;font-weight:700;letter-spacing:.06em;
  text-transform:uppercase;color:var(--muted)}
.rs-rozet{display:inline-flex;align-items:center;gap:6px;font-size:12px;padding:4px 9px;
  border-radius:999px;background:var(--brand-soft);color:var(--brand);border:1px solid transparent}
.rs-rozet:hover{border-color:var(--brand)}
.rs-rozet svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:2;
  stroke-linecap:round}

.rs-gorunumler{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-bottom:14px}
.rs-gorunumler>span{font-size:11px;font-weight:700;letter-spacing:.06em;
  text-transform:uppercase;color:var(--muted)}
.rs-gorunum{display:inline-flex;align-items:center;gap:4px;font-size:12px;
  border:1px solid var(--line);border-radius:999px;padding:3px 5px 3px 11px;background:var(--card)}
.rs-gorunum a{font-weight:600;color:var(--ink)}
.rs-gorunum a:hover{color:var(--brand)}
.rs-gorunum i{font-style:normal;font-size:10px;color:var(--muted);
  background:var(--bg);border-radius:4px;padding:1px 5px;margin-left:4px}
.rs-gorunum button{background:none;border:none;cursor:pointer;color:var(--muted);
  display:flex;padding:3px;border-radius:50%}
.rs-gorunum button:hover{color:var(--danger);background:var(--danger-soft)}
.rs-gorunum button svg{width:11px;height:11px;fill:none;stroke:currentColor;stroke-width:2;
  stroke-linecap:round}
.rs-kip{margin-bottom:16px}

/* Yönetici özeti: ekranın ilk okunan cümlesi. */
.rs-ozet-serit{display:flex;gap:14px;align-items:flex-start;margin-bottom:16px;
  padding:14px 18px;border-radius:12px;background:var(--card);border:1px solid var(--line);
  border-left:3px solid var(--brand)}
.rso-et{font-size:10.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;
  color:var(--brand);white-space:nowrap;padding-top:2px}
.rs-ozet-serit p{margin:0;font-size:14px;line-height:1.6;color:var(--ink)}

/* KPI şeridi */
.rs-kpi{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));
  margin-bottom:16px}
.rs-kpi-kart{background:var(--card);border:1px solid var(--line);border-radius:12px;
  padding:15px 17px 13px;display:flex;flex-direction:column;gap:3px;
  position:relative;overflow:hidden;transition:box-shadow .14s,transform .14s}
.rs-kpi-kart:hover{box-shadow:0 4px 14px rgba(15,23,42,.07);transform:translateY(-1px)}
/* Durum rengi: KPIDurum ile "iyi/uyarı/kötü" işaretlenen kart, üstündeki ince
   şeritle ayrışır. Renk kartın tamamını boyamaz — sayı okunaklı kalmalı. */
.rs-kpi-kart::before{content:"";position:absolute;inset:0 0 auto 0;height:3px;
  background:transparent}
.rs-kpi-kart.k-iyi::before{background:var(--success)}
.rs-kpi-kart.k-uyari::before{background:var(--warning)}
.rs-kpi-kart.k-kotu::before{background:var(--danger)}
.rs-kpi-kart.k-iyi .rsk-deger{color:var(--success)}
.rs-kpi-kart.k-kotu .rsk-deger{color:var(--danger)}
.rsk-et{font-size:12px;color:var(--muted);font-weight:600}
.rsk-deger{font-size:27px;font-weight:700;letter-spacing:-.02em;line-height:1.15;
  font-variant-numeric:tabular-nums}
.rsk-degisim{display:flex;align-items:center;gap:5px;font-size:12px;margin-top:2px}
.rsk-degisim svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:2;
  stroke-linecap:round;stroke-linejoin:round}
.rsk-degisim b{font-weight:650;font-variant-numeric:tabular-nums}
.rsk-degisim span{color:var(--muted)}
.rsk-degisim.d-iyi{color:var(--success)}
.rsk-degisim.d-kotu{color:var(--danger)}
.rsk-degisim.d-yok{color:var(--muted)}
.rsk-alt{font-size:11.5px;color:var(--muted);margin-top:1px}
.rsk-kivilcim{margin-top:8px;margin-left:-2px}

/* Önemli bulgular */
.rs-bulgular{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));
  margin-bottom:16px}
.rs-bulgu{display:flex;gap:11px;align-items:flex-start;padding:13px 15px;border-radius:11px;
  background:var(--card);border:1px solid var(--line);border-left:3px solid var(--line)}
.rs-bulgu.b-artis{border-left-color:var(--success)}
.rs-bulgu.b-azalis{border-left-color:var(--danger)}
.rs-bulgu.b-uyari{border-left-color:var(--warning);background:var(--warning-soft)}
.rs-bulgu.b-firsat{border-left-color:var(--purple)}
.rs-bulgu.b-bilgi{border-left-color:var(--brand)}
.rsb-ikon{flex-shrink:0;width:26px;height:26px;border-radius:8px;display:flex;
  align-items:center;justify-content:center;background:var(--bg)}
.rsb-ikon svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.8;
  stroke-linecap:round;stroke-linejoin:round}
.b-artis .rsb-ikon{color:var(--success)} .b-azalis .rsb-ikon{color:var(--danger)}
.b-uyari .rsb-ikon{color:var(--warning);background:var(--card)}
.b-firsat .rsb-ikon{color:var(--purple)} .b-bilgi .rsb-ikon{color:var(--brand)}
.rs-bulgu b{display:block;font-size:13px;font-weight:650;margin-bottom:3px}
.rs-bulgu p{margin:0;font-size:12.5px;line-height:1.55;color:var(--muted)}
.rs-bulgu a{display:inline-block;margin-top:6px;font-size:12px;font-weight:600;color:var(--brand)}

.rs-iki{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(360px,1fr));
  margin-bottom:14px}
.rs-grafik{grid-column:span 1}
@media (min-width:1100px){.rs-iki .rs-grafik{grid-column:span 1}}
/* Dar kırılım kartlarında başlık ile açıklama yan yana sıkışıyordu. */
.rs-iki .card-head{flex-wrap:wrap;row-gap:2px}
.rs-iki .card-head .card-note{flex-basis:100%;text-align:left;margin-left:0}

.rs-halka-kart .rs-halka{display:flex;align-items:center;gap:18px;flex-wrap:wrap;padding:6px 0}
.rs-halka-legend{display:flex;flex-direction:column;gap:7px;flex:1;min-width:160px}
.rs-halka-legend div{display:flex;align-items:center;gap:8px;font-size:12.5px}
.rs-halka-legend span{flex:1;color:var(--muted)}
.rs-halka-legend b{font-variant-numeric:tabular-nums}

/* Yatay bar kırılımı — uzun adlarda dikey sütundan çok daha okunur. */
.rs-bar-liste{display:flex;flex-direction:column;gap:11px;padding-top:4px}
.rs-bar-ust{display:flex;align-items:baseline;gap:10px;margin-bottom:4px}
.rs-bar-ad{flex:1;font-size:13px;font-weight:600;min-width:0;overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap}
a.rs-bar-ad{color:var(--ink)}
a.rs-bar-ad:hover{color:var(--brand)}
.rs-bar-deger{font-size:13px;font-weight:650;font-variant-numeric:tabular-nums;white-space:nowrap}
.rs-bar-cizgi{height:8px;border-radius:5px;background:var(--bg);overflow:hidden}
.rs-bar-cizgi i{display:block;height:100%;border-radius:5px;transition:width .3s;
  background-image:linear-gradient(90deg,rgba(255,255,255,.22),rgba(255,255,255,0))}
.rs-bar:hover .rs-bar-cizgi i{filter:saturate(1.15) brightness(1.04)}
.rs-bar-alt{margin-top:4px;font-size:11.5px;color:var(--muted)}

/* Kırılım kartı: halka solda, liste sağda iki sütun. Aynı veriyi iki ayrı
   kartta çizmek ekranın yarısını yinelemeye harcıyordu. */
.rs-iki .card.rs-genis{grid-column:1/-1}
.rs-kir-yan{display:flex;align-items:flex-start;gap:22px}
.rs-kir-gorsel{flex:0 0 190px;display:flex;justify-content:center;padding-top:2px}
.rs-kir-gorsel svg{width:190px;height:190px}
.rs-kir-liste{flex:1;min-width:0}
.rs-bar-sutunlu{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
  gap:10px 26px}
.rs-bar-nokta{display:inline-block;width:8px;height:8px;border-radius:3px;margin-right:7px;
  vertical-align:1px}
/* Süzgeçte olan satır: seçili olduğu tek bakışta anlaşılmalı, tıklayınca kalkar. */
.rs-bar.is-secili .rs-bar-ad{color:var(--brand)}
.rs-bar.is-secili .rs-bar-ust::after{content:"seçili";font-size:10px;font-weight:700;
  letter-spacing:.04em;text-transform:uppercase;color:var(--brand);background:var(--brand-soft,#e8f1fd);
  border-radius:4px;padding:2px 5px;align-self:center}
@media (max-width:900px){
  .rs-kir-yan{flex-direction:column;align-items:stretch}
  .rs-kir-gorsel{flex:none}
}

/* Çoklu panel içindeki eşleşme kipi: yalnız iki ve üzeri seçimde görünür. */
.rs-coklu-kip{padding:8px 9px 2px;border-top:1px solid var(--line);margin-top:6px}
.rs-coklu-kip[hidden]{display:none}
.rs-coklu-kip>span{display:block;font-size:11px;font-weight:700;letter-spacing:.05em;
  text-transform:uppercase;color:var(--muted);margin-bottom:6px}
.rs-kip-secim{display:flex;gap:6px}
.rs-kip-secim label{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;
  border:1px solid var(--line);border-radius:7px;padding:6px 8px;font-size:12.5px;
  color:var(--ink);cursor:pointer}
.rs-kip-secim input{margin:0;width:13px;height:13px;accent-color:var(--brand)}
.rs-kip-secim label:has(input:checked){border-color:var(--brand);color:var(--brand);
  background:var(--brand-soft,#e8f1fd);font-weight:600}

/* Uzun rapor tablolarında satır takibi: zebra + imleç satırı. Elli satırlık
   bir listede göz yanlış satıra kayıyordu. Başlık yapışkan: aşağı kaydırınca
   hangi sütuna baktığın kaybolmasın. */
/* Veri kaynağı rozeti: rapor başlığının altında ve katalog kartının üstünde
   aynı görünür — kullanıcı işareti bir kez öğrenip her yerde tanısın. */
.rs-kaynak{display:inline-flex;align-items:center;gap:6px;margin:6px 0 2px;
  padding:4px 10px;border-radius:999px;font-size:12px;
  background:color-mix(in srgb,var(--brand) 9%,transparent);color:var(--brand);
  border:1px solid color-mix(in srgb,var(--brand) 22%,transparent)}
.rs-kaynak svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.7;
  stroke-linecap:round;stroke-linejoin:round}
.rs-kaynak span{color:var(--muted)}
.rs-kaynak.rs-kaynak-ornek{background:color-mix(in srgb,var(--warning) 12%,transparent);
  color:var(--warning-ink,#8a5a00);border-color:color-mix(in srgb,var(--warning) 34%,transparent)}
.rs-kaynak.rs-kaynak-ornek span{color:inherit;opacity:.85}
.rp-birim-kaynak svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.8;
  stroke-linecap:round;stroke-linejoin:round}
.rpk-kaynak{display:inline-flex;align-items:center;gap:4px;font-size:10.5px;font-weight:650;
  padding:2px 7px;border-radius:999px;margin-left:auto;white-space:nowrap;flex-shrink:0;
  background:color-mix(in srgb,var(--brand) 10%,transparent);color:var(--brand)}
.rpk-kaynak svg{width:11px;height:11px;fill:none;stroke:currentColor;stroke-width:1.9;
  stroke-linecap:round;stroke-linejoin:round}

.rs-tablo tbody tr:nth-child(even){background:color-mix(in srgb,var(--bg) 55%,transparent)}
.rs-tablo tbody tr:hover{background:color-mix(in srgb,var(--brand) 6%,transparent)}
.rs-tablo thead th{position:sticky;top:0;z-index:2;background:var(--card);
  box-shadow:inset 0 -1px 0 var(--line)}
.rs-tablo tfoot td{border-top:1.5px solid var(--line);background:var(--bg)}
.rs-sayfa{display:flex;align-items:center;justify-content:center;gap:14px;padding:12px 0 2px;
  font-size:12.5px;color:var(--muted)}

/* ═══════════════ RAPOR YAZDIRMA DÜZENİ ═══════════════ */
/* Ekranın kopyası değil, e-postayla gönderilebilecek bir belge. */
.rs-belge{background:var(--card);border:1px solid var(--line);border-radius:12px;
  padding:34px 38px;max-width:1000px}
.rsb-ust{display:flex;align-items:flex-start;gap:22px;padding-bottom:18px;
  border-bottom:2px solid var(--ink);flex-wrap:wrap}
.rsb-logo{height:34px;width:auto}
.rsb-kimlik{flex:1;min-width:220px}
.rsb-kimlik h1{margin:0 0 4px;font-size:22px;font-weight:700;letter-spacing:-.02em}
.rsb-kimlik p{margin:0;font-size:12.5px;color:var(--muted);line-height:1.5}
.rsb-kunye{display:flex;flex-direction:column;gap:4px;font-size:11.5px;text-align:right}
.rsb-kunye div{display:flex;gap:10px;justify-content:flex-end}
.rsb-kunye span{color:var(--muted)}
.rsb-kunye b{font-variant-numeric:tabular-nums}
.rsb-suzgec{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:12px 0;
  border-bottom:1px solid var(--line);font-size:11.5px}
.rsb-suzgec>span{color:var(--muted);text-transform:uppercase;letter-spacing:.06em;font-weight:700}
.rsb-suzgec b{background:var(--bg);border-radius:5px;padding:2px 8px;font-weight:600}
.rsb-bolum{padding:18px 0;border-bottom:1px solid var(--line)}
.rsb-bolum:last-of-type{border-bottom:none}
.rsb-bolum h2{margin:0 0 10px;font-size:14px;font-weight:700;letter-spacing:-.01em}
.rsb-ozet{margin:0;font-size:14px;line-height:1.65}
.rsb-kpi{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}
.rsb-kpi div{display:flex;flex-direction:column;gap:2px}
.rsb-kpi span{font-size:11.5px;color:var(--muted)}
.rsb-kpi b{font-size:22px;font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.rsb-kpi i{font-style:normal;font-size:11px;color:var(--muted)}
.rsb-kpi i.d-iyi{color:var(--success)} .rsb-kpi i.d-kotu{color:var(--danger)}
.rsb-bulgu{margin:0;padding-left:0;list-style:none;display:flex;flex-direction:column;gap:9px}
.rsb-bulgu li{font-size:12.5px;line-height:1.55;padding-left:12px;border-left:3px solid var(--line)}
.rsb-bulgu li.b-uyari{border-left-color:var(--warning)}
.rsb-bulgu li.b-artis{border-left-color:var(--success)}
.rsb-bulgu li.b-azalis{border-left-color:var(--danger)}
.rsb-bulgu li.b-firsat{border-left-color:var(--purple)}
.rsb-tablo{width:100%;border-collapse:collapse;font-size:12.5px}
.rsb-tablo th{text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.05em;
  color:var(--muted);padding:6px 8px;border-bottom:1px solid var(--line)}
.rsb-tablo td{padding:7px 8px;border-bottom:1px solid var(--line)}
.rsb-alt{display:flex;gap:20px;justify-content:space-between;padding-top:16px;
  border-top:1px solid var(--line);font-size:10.5px;color:var(--muted);line-height:1.55}
.rsb-sayfa{white-space:nowrap}

@media print{
  .rs-yazdir-cubuk{display:none!important}
  .rs-belge{border:none;padding:0;max-width:none;border-radius:0}
  .rsb-bolum{break-inside:avoid;page-break-inside:avoid}
  /* Yazdırmada sabit yükseklik yerine oran: esnetilen yazı kâğıtta daha da
     belirgin bozuluyordu. */
  .rg-svg{height:auto;aspect-ratio:720/260}
}

/* Rapor merkezi: sık kullanılan / son görüntülenen bölümleri */
.rp-kart.rp-fav{border-color:var(--warning)}
/* Sabitleme düğmesi: kartın köşesinde, kartın kendisi bağlantı olduğu için
   kardeş öğe olarak konumlanır. */
.rp-kart-sar{position:relative;display:flex}
.rp-kart-sar > .rp-kart{flex:1;min-width:0}
.rpk-pin-form{position:absolute;top:10px;right:10px;margin:0;line-height:0}
.rpk-pin{
  width:28px;height:28px;border:1px solid transparent;border-radius:7px;
  background:transparent;color:var(--line);cursor:pointer;
  display:flex;align-items:center;justify-content:center;padding:0;
  transition:color .15s,border-color .15s,background .15s;
}
.rpk-pin svg{width:15px;height:15px;fill:currentColor;stroke:none}
.rpk-pin:hover{color:var(--warning);border-color:var(--line);background:var(--bg)}
.rpk-pin.is-on{color:var(--warning)}
/* Kart üstündeki rozetler düğmenin altına girmesin. */
.rp-kart-sar .rpk-ust{padding-right:30px}
/* Üst sıra bölümü: birim renk paletine girmediği için kendi rozet rengiyle
   ayrılıyor (yıldız = sabitleme). */
.rp-grup.rp-ust .rp-grup-ikon{background:var(--warning-soft);color:var(--warning)}
.rp-grup.rp-ust .rp-grup-ikon svg{fill:currentColor;stroke:none}
.rp-grup.rp-ust .rp-grup-sayi{background:var(--warning-soft);color:var(--warning)}
.rpk-son{font-style:normal;font-weight:500;color:var(--muted);font-size:11.5px;margin-left:auto}
.rpk-git{justify-content:flex-start;gap:6px}

/* Banka eşleştirme adayları */
.tablo-liste{display:flex;flex-direction:column;gap:8px}
.oneri-satir{display:flex;align-items:center;gap:12px;margin:0;padding:10px 12px;
  border:1px solid var(--line);border-radius:9px;background:var(--card)}
.oneri-satir:hover{border-color:var(--brand)}
.oneri-bilgi{flex:1;min-width:0}
.oneri-bilgi b{font-size:13.5px}
.oneri-bilgi .badge{margin-left:7px}

/* Mükellefiyet sorgusunda sonucun kaynağı */
.gs-kaynak{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin:10px 0 4px;
  padding:9px 12px;border:1px solid var(--line);border-radius:9px;background:var(--bg);
  font-size:12.5px;color:var(--muted)}

/* ═══════════════ DUYURU DÜZENLEYİCİ ═══════════════ */
.dz-duzen{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:14px;align-items:start}
.dz-sag{position:sticky;top:14px}
.dz-yapisik{overflow:hidden}

.dz-bloklar{display:flex;flex-direction:column;gap:10px}
.dz-blok{border:1px solid var(--line);border-radius:10px;padding:10px 12px;background:var(--card)}
.dz-blok-ust{display:flex;align-items:center;justify-content:space-between;margin-bottom:7px}
.dz-blok-ad{font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
.dz-blok-arac{display:flex;gap:3px}
.dz-blok-arac button{width:24px;height:24px;border:1px solid var(--line);border-radius:6px;
  background:var(--card);color:var(--muted);cursor:pointer;font-size:12px;line-height:1;padding:0}
.dz-blok-arac button:hover{border-color:var(--brand);color:var(--brand)}
.dz-ekle{display:flex;gap:6px;flex-wrap:wrap;margin-top:12px;padding-top:12px;
  border-top:1px dashed var(--line)}
.dz-alanlar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:10px}
.dz-alan{border:1px solid var(--line);background:var(--bg);border-radius:6px;padding:2px 8px;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;color:var(--brand);cursor:pointer}
.dz-alan:hover{border-color:var(--brand)}
.dz-kaynak{display:flex;gap:16px;flex-wrap:wrap;font-size:13px}
.dz-kaynak label{display:flex;gap:6px;align-items:center}

/* Önizleme, firma kartındaki e-posta önizlemesiyle aynı bileşeni kullanır
   (.he-oniz-kutu + çerçeve); duyuruya özel "sahte e-posta" görünümü kaldırıldı. */
.dz-onizleme{background:var(--bg);padding:12px}

.dz-sayim{padding:12px 14px;border-top:1px solid var(--line);font-size:14px}
.dz-sayim b{font-size:19px;color:var(--brand)}
.dz-sayim .cell-sub{display:block;margin-top:2px}
.dz-kitle-link{display:inline-flex;align-items:center;gap:6px;margin-top:8px;
  font-size:12.5px;font-weight:600;color:var(--brand);text-decoration:none}
.dz-kitle-link:hover{text-decoration:underline}
.dz-kitle-link svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round}
.dz-denetim{border-top:1px solid var(--line);padding:10px 14px;display:flex;
  flex-direction:column;gap:5px}
.dz-denetim-satir{display:flex;gap:8px;align-items:flex-start;font-size:12.5px;color:var(--ink2)}
.dz-denetim-satir span{width:16px;flex-shrink:0;font-weight:700;text-align:center}
.dz-denetim-satir.ok span{color:var(--success)}
.dz-denetim-satir.uyari span{color:var(--warning)}
.dz-denetim-satir.eksik span{color:var(--danger)}
.dz-denetim-satir.eksik{color:var(--danger)}

.dz-gonder{display:flex;gap:16px;align-items:flex-end;flex-wrap:wrap;
  border-top:1px solid var(--line);padding-top:14px}
.dz-test{display:flex;gap:8px;align-items:flex-end;margin:0}
.dz-test input{min-width:230px}

@media (max-width:1180px){
  .dz-duzen{grid-template-columns:1fr}
  .dz-sag{position:static}
}

/* Hızlı e-posta paneli */
.he-form{padding:2px}
.he-dugme{display:inline-flex;align-items:center;gap:6px}

/* ═══════════════ EKİP SOHBETİ ═══════════════ */
.sh-duzen{display:grid;grid-template-columns:300px minmax(0,1fr);gap:14px;
  height:calc(100vh - 132px);min-height:480px}
.sh-yan{background:var(--card);border:1px solid var(--line);border-radius:12px;
  display:flex;flex-direction:column;overflow:hidden}
.sh-yan-ust{display:flex;gap:8px;padding:11px 12px;border-bottom:1px solid var(--line)}
.sh-ara{flex:1;display:flex;align-items:center;gap:7px;background:var(--bg);
  border:1px solid var(--line);border-radius:8px;padding:0 10px;margin:0}
.sh-ara svg{width:15px;height:15px;fill:none;stroke:var(--muted);stroke-width:1.6;flex-shrink:0}
.sh-ara input{flex:1;border:none;background:none;height:32px;font:inherit;font-size:13px;
  color:var(--ink);outline:none;min-width:0}
.sh-yeni{width:32px;height:32px;border-radius:8px;border:none;background:var(--brand);
  color:#fff;font-size:19px;line-height:1;cursor:pointer;flex-shrink:0}
.sh-yeni:hover{filter:brightness(1.07)}
.sh-liste{flex:1;overflow-y:auto;padding:6px}
.sh-bolum{padding:9px 13px;font-size:10.5px;font-weight:700;letter-spacing:.07em;
  text-transform:uppercase;color:var(--muted);border-bottom:1px solid var(--line)}
.sh-bolum a{color:var(--brand);text-transform:none;letter-spacing:0;font-size:12px}
.sh-kanal{display:flex;gap:10px;align-items:center;padding:9px 10px;border-radius:9px;
  text-decoration:none;color:var(--ink)}
.sh-kanal:hover{background:var(--bg)}
.sh-kanal.is-on{background:var(--brand-soft)}
.sh-kanal-ic{flex:1;min-width:0}
.sh-kanal-ust{display:flex;align-items:center;gap:6px}
.sh-kanal-ust b{flex:1;font-size:13.5px;font-weight:600;overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap}
.sh-kanal-ust i{display:flex;gap:4px;font-style:normal}
.sh-kanal-ust em{font-style:normal;background:var(--brand);color:#fff;font-size:10.5px;
  font-weight:700;min-width:18px;height:18px;border-radius:999px;padding:0 5px;
  display:inline-flex;align-items:center;justify-content:center}
.sh-bahis-rozet{background:var(--danger) !important}
.sh-kanal-son{display:block;font-size:12px;color:var(--muted);overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap;margin-top:1px}
.sh-bos-yan{padding:20px;font-size:13px;color:var(--muted);text-align:center}
.sh-sonuc{display:block;padding:9px 10px;border-radius:9px;text-decoration:none;color:var(--ink)}
.sh-sonuc:hover{background:var(--bg)}
.sh-sonuc-ust{display:flex;justify-content:space-between;font-size:12.5px}
.sh-sonuc-ust span{color:var(--muted);font-size:11.5px}
.sh-sonuc-kanal{font-size:11px;color:var(--brand)}
.sh-sonuc-metin{font-size:12.5px;color:var(--muted);margin-top:2px;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

.sh-avatar{width:34px;height:34px;border-radius:10px;display:inline-flex;align-items:center;
  justify-content:center;font-size:12.5px;font-weight:700;color:#fff;flex-shrink:0;
  background:var(--brand)}
.sh-avatar.sm{width:24px;height:24px;border-radius:7px;font-size:10.5px}

.sh-govde{background:var(--card);border:1px solid var(--line);border-radius:12px;
  display:flex;flex-direction:column;overflow:hidden;min-width:0}
.sh-baslik{display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:12px 16px;border-bottom:1px solid var(--line)}
.sh-baslik-ad{font-size:15px;font-weight:650}
.sh-baslik-alt{font-size:12px;color:var(--muted);margin-top:1px}
.sh-baslik-arac{display:flex;align-items:center;gap:10px}
.sh-uyeler{display:flex}
.sh-uyeler .sh-avatar{margin-left:-6px;border:2px solid var(--card)}

.sh-akis{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:12px;
  background:var(--bg)}
.sh-ayrac{display:flex;align-items:center;gap:10px;margin:6px 0}
.sh-ayrac::before,.sh-ayrac::after{content:"";flex:1;height:1px;background:var(--line)}
.sh-ayrac span{font-size:11.5px;color:var(--muted);font-weight:600}
.sh-mesaj{display:flex;gap:10px;align-items:flex-start;position:relative}
.sh-mesaj.benim{flex-direction:row-reverse}
.sh-balon{background:var(--card);border:1px solid var(--line);border-radius:12px;
  padding:9px 13px;max-width:min(70%,640px);min-width:0}
.sh-mesaj.benim .sh-balon{background:var(--brand-soft);border-color:transparent}
.sh-mesaj-ust{display:flex;align-items:baseline;gap:8px;margin-bottom:3px}
.sh-mesaj-ust b{font-size:12.5px;font-weight:650}
.sh-mesaj-ust span{font-size:11px;color:var(--muted)}
.sh-mesaj-ust i{font-size:10.5px;color:var(--muted);font-style:normal}
.sh-metin{font-size:14px;line-height:1.55;word-break:break-word}
.sh-metin code{background:var(--bg);border:1px solid var(--line);border-radius:5px;
  padding:1px 5px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12.5px}
.sh-metin a{color:var(--brand)}
.sh-metin a.sm-panel{background:var(--bg);border:1px solid var(--line);border-radius:6px;
  padding:1px 7px;text-decoration:none;font-size:12.5px}
.sh-metin a.sm-panel::before{content:"↗ ";color:var(--muted)}
.sm-bahis{background:var(--brand-soft);color:var(--brand);border-radius:5px;padding:0 4px;font-weight:600}
.sh-yanit{border-left:3px solid var(--brand);background:var(--bg);border-radius:0 7px 7px 0;
  padding:5px 9px;margin-bottom:6px;font-size:12.5px;color:var(--muted)}
.sh-yanit b{color:var(--ink);margin-right:6px}
.sh-yonlendirme{font-size:11.5px;color:var(--muted);margin-bottom:5px}
.sh-silindi{font-size:13px;color:var(--muted);font-style:italic}
.sh-gorsel{display:block;margin-top:8px}
.sh-gorsel img{max-width:320px;max-height:260px;border-radius:9px;border:1px solid var(--line);
  display:block}
.sh-dosya{display:inline-flex;align-items:center;gap:7px;margin-top:8px;background:var(--bg);
  border:1px solid var(--line);border-radius:8px;padding:7px 11px;font-size:12.5px;
  text-decoration:none;color:var(--ink)}
.sh-dosya svg{width:15px;height:15px;fill:none;stroke:var(--muted);stroke-width:1.5}
.sh-mesaj-arac{position:absolute;top:-9px;display:none;gap:2px;background:var(--card);
  border:1px solid var(--line);border-radius:8px;padding:2px;box-shadow:var(--shadow)}
.sh-mesaj:not(.benim) .sh-mesaj-arac{left:52px}
.sh-mesaj.benim .sh-mesaj-arac{right:52px}
.sh-mesaj:hover .sh-mesaj-arac{display:flex}
.sh-mesaj-arac button{width:26px;height:26px;border:none;background:none;border-radius:6px;
  color:var(--muted);cursor:pointer;font-size:13px;line-height:1;padding:0}
.sh-mesaj-arac button:hover{background:var(--bg);color:var(--brand)}
.sh-mesaj-arac form{margin:0;display:inline}
.sh-bos{display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:6px;padding:40px;color:var(--muted);text-align:center;margin:auto}
.sh-bos b{color:var(--ink);font-size:15px}
.sh-bos p{margin:0;font-size:13px}

.sh-yazac{border-top:1px solid var(--line);padding:10px 14px 12px}
.sh-yanit-serit,.sh-ek-serit{display:flex;align-items:center;gap:9px;background:var(--bg);
  border-radius:8px;padding:6px 10px;margin-bottom:8px;font-size:12.5px;color:var(--muted)}
.sh-yanit-serit[hidden],.sh-ek-serit[hidden]{display:none}
.sh-yanit-serit span,.sh-ek-serit span{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sh-yanit-serit button,.sh-ek-serit button{border:none;background:none;color:var(--muted);
  cursor:pointer;font-size:13px}
.sh-form{display:flex;align-items:flex-end;gap:8px;margin:0}
.sh-form textarea{flex:1;border:1px solid var(--line);border-radius:10px;padding:9px 12px;
  font:inherit;font-size:14px;line-height:1.5;resize:none;max-height:180px;background:var(--card);
  color:var(--ink);outline:none}
.sh-form textarea:focus{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}
.sh-ek-dugme,.sh-gonder{width:38px;height:38px;border-radius:10px;display:flex;
  align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;border:1px solid var(--line);
  background:var(--card)}
.sh-ek-dugme:hover{border-color:var(--brand)}
.sh-ek-dugme svg,.sh-gonder svg{width:18px;height:18px;fill:none;stroke:currentColor;
  stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.sh-ek-dugme{color:var(--muted)}
.sh-gonder{background:var(--brand);border-color:var(--brand);color:#fff}
.sh-gonder:hover{filter:brightness(1.07)}
.sh-ipucu{font-size:11.5px;color:var(--muted);margin-top:7px}

.sh-sekme{display:flex;gap:6px;margin-bottom:14px}
.sh-sekme-b{flex:1;border:1px solid var(--line);background:var(--card);border-radius:8px;
  padding:8px;font:inherit;font-size:13px;cursor:pointer;color:var(--muted)}
.sh-sekme-b.is-on{border-color:var(--brand);color:var(--brand);background:var(--brand-soft);font-weight:600}
.sh-kisi-liste{max-height:230px;overflow-y:auto;border:1px solid var(--line);border-radius:9px;
  padding:6px}
.sh-kisi-liste label{display:flex;align-items:center;gap:9px;padding:6px 8px;border-radius:7px;
  font-size:13px;cursor:pointer}
.sh-kisi-liste label:hover{background:var(--bg)}

@media (max-width:900px){
  .sh-duzen{grid-template-columns:1fr;height:auto}
  .sh-yan{max-height:320px}
  .sh-govde{min-height:60vh}
  .sh-balon{max-width:86%}
}

/* Menüdeki sohbet rozeti */
.nav-rozet{margin-left:auto;background:var(--danger);color:#fff;font-size:10.5px;font-weight:700;
  min-width:18px;height:18px;border-radius:999px;padding:0 5px;display:inline-flex;
  align-items:center;justify-content:center;flex-shrink:0}

/* ═══════════════ KÖŞE SOHBETİ ═══════════════ */
/* Belge ekranları (teklif PDF önizlemesi, fatura belgesi, hesap ekstresi,
   paket fiyat listesi, onboarding belgesi): sayfa bir çıktının birebir
   görüntüsü, üstünde yüzen düğme onun parçası değil. */
.belge-ekrani .sk-dugme{display:none}
.sk-dugme{position:fixed;right:22px;bottom:22px;width:54px;height:54px;border-radius:50%;
  border:none;background:var(--brand);color:#fff;cursor:pointer;z-index:90;
  box-shadow:0 8px 24px rgba(15,49,86,.28);display:flex;align-items:center;justify-content:center}
.sk-dugme:hover{filter:brightness(1.08)}
.sk-dugme svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.6;
  stroke-linecap:round;stroke-linejoin:round}
.sk-rozet{position:absolute;top:-2px;right:-2px;background:var(--danger);color:#fff;
  font-size:11px;font-weight:700;min-width:20px;height:20px;border-radius:999px;padding:0 6px;
  display:flex;align-items:center;justify-content:center;border:2px solid var(--card)}
.sk-rozet[hidden]{display:none}

.sk-pencere{position:fixed;right:22px;bottom:88px;width:360px;height:min(540px,calc(100vh - 140px));
  background:var(--card);border:1px solid var(--line);border-radius:14px;z-index:90;
  box-shadow:0 16px 44px rgba(15,49,86,.22);display:flex;flex-direction:column;overflow:hidden}
.sk-pencere[hidden]{display:none}
.sk-ust{display:flex;align-items:center;gap:8px;padding:11px 13px;border-bottom:1px solid var(--line)}
.sk-baslik{flex:1;font-size:14px;font-weight:650;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sk-ust button,.sk-ust a{border:none;background:none;color:var(--muted);cursor:pointer;
  font-size:15px;line-height:1;padding:3px 5px;border-radius:6px;text-decoration:none}
.sk-ust button:hover,.sk-ust a:hover{background:var(--bg);color:var(--brand)}
.sk-geri[hidden]{display:none}

.sk-liste{flex:1;overflow-y:auto;padding:6px}
.sk-liste[hidden]{display:none}
.sk-satir{display:flex;gap:9px;align-items:center;padding:8px 9px;border-radius:9px;cursor:pointer}
.sk-satir:hover{background:var(--bg)}
.sk-satir-ic{flex:1;min-width:0}
.sk-satir-ust{display:flex;align-items:center;gap:6px}
.sk-satir-ust b{flex:1;font-size:13px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sk-satir-son{display:block;font-size:11.5px;color:var(--muted);overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap}
.sk-say{background:var(--brand);color:#fff;font-size:10px;font-weight:700;min-width:17px;height:17px;
  border-radius:999px;padding:0 5px;display:inline-flex;align-items:center;justify-content:center}
.sk-say.bahis{background:var(--danger)}

.sk-akis{flex:1;overflow-y:auto;padding:12px;background:var(--bg);display:flex;
  flex-direction:column;gap:9px}
.sk-akis[hidden]{display:none}
.sk-m{max-width:82%;background:var(--card);border:1px solid var(--line);border-radius:11px;
  padding:7px 11px;font-size:13.2px;line-height:1.5;word-break:break-word}
.sk-m.benim{align-self:flex-end;background:var(--brand-soft);border-color:transparent}
.sk-m-ust{display:flex;gap:7px;align-items:baseline;margin-bottom:2px}
.sk-m-ust b{font-size:11.5px}
.sk-m-ust span{font-size:10.5px;color:var(--muted)}
.sk-m a{color:var(--brand)}
.sk-m code{background:var(--bg);border:1px solid var(--line);border-radius:4px;padding:0 4px;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px}
.sk-m img{max-width:100%;border-radius:8px;margin-top:6px;display:block}

.sk-yaz{display:flex;align-items:flex-end;gap:7px;padding:9px 11px;border-top:1px solid var(--line);margin:0}
.sk-yaz[hidden]{display:none}
.sk-yaz textarea{flex:1;border:1px solid var(--line);border-radius:9px;padding:7px 10px;
  font:inherit;font-size:13.2px;line-height:1.45;resize:none;max-height:110px;outline:none;
  background:var(--card);color:var(--ink)}
.sk-yaz textarea:focus{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}
.sk-yaz button{width:34px;height:34px;border-radius:9px;border:none;background:var(--brand);
  color:#fff;cursor:pointer;flex-shrink:0;display:flex;align-items:center;justify-content:center}
.sk-yaz button svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.6;
  stroke-linecap:round;stroke-linejoin:round}
.sk-bos{padding:24px 16px;text-align:center;font-size:12.5px;color:var(--muted)}

/* Sohbet sayfasındayken köşe penceresi gereksiz. */
body[data-sayfa="sohbet"] .sk-dugme,body[data-sayfa="sohbet"] .sk-pencere{display:none}
@media (max-width:620px){
  .sk-pencere{right:10px;left:10px;width:auto;bottom:80px}
  .sk-dugme{right:14px;bottom:14px}
}

/* ── Yan menü · iş aileleri ──────────────────────────────────────────────────
   Menü 25 satır; düz liste hâlinde göz her seferinde baştan tarıyordu. Yedi
   aile başlığı listeyi kısa bloklara böler ve aynı zamanda katlama düğmesidir.

   Renk NOT: kenar çubuğu koyu lacivert. <button> kendi kullanıcı-ajanı rengini
   (siyah) kullanır ve `font:inherit` rengi taşımaz — başlıklar koyu zeminde
   görünmez oluyordu. Renk açıkça veriliyor. */
.nav-aile{
  display:flex; align-items:center; gap:6px; width:100%;
  margin:0; padding:11px 15px 4px;
  background:none; border:0; cursor:pointer; text-align:left;
  font-family:inherit; font-size:9.5px; font-weight:700;
  letter-spacing:.12em; text-transform:uppercase;
  color:rgba(255,255,255,.54);
  transition:color .15s ease;
}
.nav-group > .nav-aile:first-child{padding-top:4px}
.nav-aile:hover{color:rgba(255,255,255,.82)}
.nav-aile:focus-visible{outline:2px solid rgba(255,255,255,.5); outline-offset:-2px; border-radius:6px}
.nav-aile svg{
  width:12px; height:12px; margin-left:auto; flex:none; fill:none;
  stroke:currentColor; stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round;
  opacity:.8; transition:transform .15s ease;
}
.nav-aile[aria-expanded="false"] svg{transform:rotate(-90deg)}
.nav-aile[aria-expanded="false"] + .nav-govde{display:none}
.nav-govde{overflow:hidden}

/* Dar kipte (1199px altı menü 64px'e iner) başlıklar yer kaplamasın; menü
   tek sütun ikona dönüşüyor, aileler ince ayraçla ayrılıyor. */
@media (max-width:1199px){
  .nav-aile{
    padding:0; height:1px; overflow:hidden; color:transparent;
    border-top:1px solid rgba(255,255,255,.09); margin:7px 12px;
  }
  .nav-aile span, .nav-aile svg{display:none}
  .nav-group > .nav-aile:first-child{display:none}
  .nav-aile[aria-expanded="false"] + .nav-govde{display:block}
}
@media (prefers-reduced-motion:reduce){.nav-aile, .nav-aile svg{transition:none}}

/* ── Aile şeridi ──────────────────────────────────────────────────────────────
   Menüde tek satır altında toplanan ekranlar arasında geçiş. Sayfanın kendi
   sekmelerinden (.tabs) bir seviye YUKARIDA durur ve ondan görsel olarak
   ayrılır: iki sekme şeridini üst üste koymak hangisinin ne olduğunu
   belirsizleştiriyordu. */
.aile-serit{
  display:flex; flex-wrap:wrap; gap:4px; margin-bottom:14px;
  background:var(--raised,#EEF3F8); border:1px solid var(--line);
  border-radius:8px; padding:4px; width:fit-content; max-width:100%;
}
.aile-oge{
  padding:5px 12px; border-radius:6px; font-size:13px; font-weight:600;
  color:var(--muted); text-decoration:none; white-space:nowrap; transition:color .12s;
}
.aile-oge:hover{color:var(--brand)}
.aile-oge.is-on{background:var(--card,#fff); color:var(--navy); box-shadow:var(--shadow)}
.aile-oge:focus-visible{outline:2px solid var(--brand); outline-offset:1px}
@media (prefers-reduced-motion:reduce){.aile-oge{transition:none}}

/* ── Komut kutusu (Ctrl/Cmd+K) ───────────────────────────────────────────────
   Panelde 25 menü satırı var; aranan kayda ulaşmak için önce doğru modülü
   hatırlamak gerekiyordu. Bu kutu tür ayrımı yapmadan kayda sıçratır. */
.kk-ort{
  position:fixed; inset:0; z-index:120; background:rgba(15,49,86,.38);
  display:flex; align-items:flex-start; justify-content:center; padding:12vh 16px 16px;
  backdrop-filter:blur(2px);
}
.kk-ort[hidden]{display:none}
.kk-kutu{
  width:100%; max-width:620px; background:var(--card,#fff); border:1px solid var(--line);
  border-radius:14px; box-shadow:0 24px 60px -20px rgba(15,49,86,.45); overflow:hidden;
  display:flex; flex-direction:column; max-height:70vh;
}
.kk-ust{display:flex; align-items:center; gap:10px; padding:14px 16px; border-bottom:1px solid var(--line)}
.kk-ust svg{width:18px; height:18px; flex:none; fill:none; stroke:var(--muted); stroke-width:1.8}
.kk-ust input{
  flex:1; border:0; outline:0; background:none; font:inherit; font-size:15.5px; color:var(--ink);
}
.kk-ust input::placeholder{color:var(--faint)}
.kk-esc{font-size:10.5px; color:var(--faint); border:1px solid var(--line); border-radius:4px; padding:2px 6px}
.kk-sonuc{overflow-y:auto; padding:6px}
.kk-grup{
  font-size:10px; letter-spacing:.12em; text-transform:uppercase; font-weight:700;
  color:var(--faint); padding:10px 10px 4px;
}
.kk-oge{
  display:flex; align-items:baseline; gap:10px; padding:8px 10px; border-radius:8px;
  cursor:pointer; text-decoration:none; color:inherit;
}
.kk-oge b{font-weight:600; font-size:14px}
.kk-oge span{font-size:12.5px; color:var(--muted); margin-left:auto; text-align:right;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:55%}
.kk-oge.is-sec, .kk-oge:hover{background:var(--raised)}
.kk-bos{padding:22px 14px; text-align:center; color:var(--muted); font-size:13.5px}
.kk-alt{
  display:flex; gap:14px; align-items:center; padding:9px 14px; border-top:1px solid var(--line);
  font-size:11.5px; color:var(--faint); background:var(--raised);
}
.kk-alt kbd{border:1px solid var(--line); border-radius:4px; padding:1px 5px; margin-right:3px;
  background:var(--card,#fff); font-size:10.5px}
.kk-ipucu{margin-left:auto}
@media (max-width:560px){.kk-ort{padding-top:6vh} .kk-ipucu{display:none}}

/* ── Seçenek listeleri yönetimi (Ayarlar → Seçenek listeleri) ──────────────
   Yedi grup alt alta yığılıyordu; solda grup listesi, sağda tek panel. */
.sc-duzen{display:grid; grid-template-columns:240px minmax(0,1fr); gap:18px; margin-top:20px}
@media (max-width:900px){ .sc-duzen{grid-template-columns:1fr} }
.sc-gruplar{display:flex; flex-direction:column; gap:4px; align-self:start;
  background:var(--surface); border:1px solid var(--line); border-radius:10px; padding:6px}
@media (max-width:900px){ .sc-gruplar{flex-direction:row; flex-wrap:wrap} }
.sc-grup{display:flex; align-items:center; gap:8px; padding:9px 11px; border-radius:7px;
  text-decoration:none; color:var(--text); font-size:14px; line-height:1.3}
.sc-grup:hover{background:var(--hover)}
.sc-grup.is-on{background:var(--brand); color:#fff; font-weight:600}
.sc-grup-ad{flex:1; min-width:0}
.sc-grup-sayi{font-size:12px; font-variant-numeric:tabular-nums; opacity:.75;
  background:rgba(0,0,0,.08); padding:1px 7px; border-radius:99px}
.sc-grup.is-on .sc-grup-sayi{background:rgba(255,255,255,.22); opacity:1}
.sc-panel{min-width:0}
.sc-ekle{display:flex; gap:8px; align-items:center; margin-bottom:12px}
.sc-ekle .input{max-width:320px}
.sc-ara-satir{display:flex; gap:10px; align-items:center; margin-bottom:10px}
.sc-ara-satir .input{max-width:280px}
.sc-tablo td{vertical-align:middle}
.sc-tablo .input{width:100%}
.sc-sira{max-width:70px; text-align:center; font-variant-numeric:tabular-nums}
.sc-kod{display:block; margin-top:3px; font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.sc-kaydet{display:flex; align-items:center; gap:14px; justify-content:space-between;
  margin-top:14px; padding-top:12px; border-top:1px solid var(--line)}

/* Satır menüsü açıkken body'ye taşınır (ata yığılma bağlamlarından kurtulmak
   için); orada sayfadaki her şeyin üstünde durmalı. Kenar çubuğu z:60,
   sabit başlık z:50 — menü ikisinin de üstünde. */
.dropdown.dd-ucuyor{z-index:120}

/* Fırsat formunda katlanabilir bölümler: zorunlu çekirdek açık, detay kapalı.
   17 alan tek ekranda giriş hızını düşürüyordu; aday bilgisi ve ürün kalemleri
   fırsat açıldıktan sonra da girilebiliyor. */
details.fy-katla > summary{cursor:pointer; list-style:none}
details.fy-katla > summary::-webkit-details-marker{display:none}
details.fy-katla > summary::after{content:"›"; margin-left:10px; color:var(--muted);
  transition:transform .15s ease; display:inline-block}
details.fy-katla[open] > summary::after{transform:rotate(90deg)}
details.fy-katla > summary:hover{background:var(--hover)}

/* ── Raporlar: birim birim renkli düzen ───────────────────────────────────
   Eskiden 24 rapor tek ızgarada aynı görünümle diziliyordu; aradığını bulmak
   kartları tek tek okumayı gerektiriyordu. Artık her birim kendi bölümünde ve
   kendi renginde. Renk birime SABİT (bkz. rapor.Birimler): kullanıcı bir kez
   "yeşil = müşteri başarı" öğreniyor, sonra aramadan buluyor. */
.rp-grup{margin-bottom:26px}
.rp-grup-bas{display:flex; align-items:center; gap:10px; margin:0 0 12px;
  padding-bottom:9px; border-bottom:1px solid var(--line)}
.rp-grup-bas h2{margin:0; font-size:15px; font-weight:650; color:var(--ink)}
/* İkon karesi dashboard sekmeleriyle (.ds-ikon) birebir aynı ölçüde: aynı
   modülü iki ekranda aynı glif ve aynı renkle görmek, birimi okumadan
   tanımayı sağlıyor. */
.rp-grup-ikon{width:26px; height:26px; border-radius:7px; flex-shrink:0;
  display:flex; align-items:center; justify-content:center}
.rp-grup-ikon svg{width:15px; height:15px; fill:none; stroke-width:1.6;
  stroke-linecap:round; stroke-linejoin:round}
.rp-grup-sayi{font-size:11px; font-weight:650; font-variant-numeric:tabular-nums;
  padding:1px 8px; border-radius:99px}
.rp-grup-aciklama{font-size:12.5px; color:var(--muted); margin-left:auto;
  text-align:right; max-width:46ch}
@media (max-width:760px){ .rp-grup-aciklama{display:none} }

/* Kartta renk yalnız sol şerit ve birim rozetinde: kart gövdesini boyamak
   24 kartı okunmaz hale getirirdi. */
.rp-kart{border-left:3px solid var(--line)}
.rp-kart .rpk-birim{border-radius:99px; padding:2px 9px; font-size:11px; font-weight:650}

.rp-birimler .rp-birim{display:inline-flex; align-items:center; gap:6px}
.rp-birimler .rp-birim svg{width:14px; height:14px; fill:none; stroke-width:1.7;
  stroke-linecap:round; stroke-linejoin:round; flex-shrink:0}

/* Palet eşlemeleri */
.r-brand   .rp-grup-ikon{background:var(--brand-soft)}
.r-purple  .rp-grup-ikon{background:var(--purple-soft)}
.r-success .rp-grup-ikon{background:var(--success-soft)}
.r-warning .rp-grup-ikon{background:var(--warning-soft)}
.r-accent  .rp-grup-ikon{background:var(--accent-soft)}
.r-danger  .rp-grup-ikon{background:var(--danger-soft)}

.r-brand   .rp-grup-ikon svg, .rp-birim.r-brand svg   { stroke:var(--brand) }
.r-purple  .rp-grup-ikon svg, .rp-birim.r-purple svg  { stroke:var(--purple) }
.r-success .rp-grup-ikon svg, .rp-birim.r-success svg { stroke:var(--success) }
.r-warning .rp-grup-ikon svg, .rp-birim.r-warning svg { stroke:var(--warning) }
.r-accent  .rp-grup-ikon svg, .rp-birim.r-accent svg  { stroke:var(--accent) }
.r-danger  .rp-grup-ikon svg, .rp-birim.r-danger svg  { stroke:var(--danger) }

.r-brand   .rp-grup-sayi{background:var(--brand-soft);   color:var(--brand)}
.r-purple  .rp-grup-sayi{background:var(--purple-soft);  color:var(--purple)}
.r-success .rp-grup-sayi{background:var(--success-soft); color:var(--success)}
.r-warning .rp-grup-sayi{background:var(--warning-soft); color:var(--warning)}
.r-accent  .rp-grup-sayi{background:var(--accent-soft);  color:var(--accent)}
.r-danger  .rp-grup-sayi{background:var(--danger-soft); color:var(--danger)}

.rp-kart.r-brand   { border-left-color:var(--brand) }
.rp-kart.r-purple  { border-left-color:var(--purple) }
.rp-kart.r-success { border-left-color:var(--success) }
.rp-kart.r-warning { border-left-color:var(--warning) }
.rp-kart.r-accent  { border-left-color:var(--accent) }
.rp-kart.r-danger  { border-left-color:var(--danger) }

.rp-kart.r-brand   .rpk-birim{background:var(--brand-soft);   color:var(--brand)}
.rp-kart.r-purple  .rpk-birim{background:var(--purple-soft);  color:var(--purple)}
.rp-kart.r-success .rpk-birim{background:var(--success-soft); color:var(--success)}
.rp-kart.r-warning .rpk-birim{background:var(--warning-soft); color:var(--warning)}
.rp-kart.r-accent  .rpk-birim{background:var(--accent-soft);  color:var(--accent)}
.rp-kart.r-danger  .rpk-birim{background:var(--danger-soft); color:var(--danger)}

/* Seçili birim hapı kendi renginin açık zeminini alır. Zemin de yazılmalı:
   .rp-birim.is-on koyu mavi dolgu veriyor, yalnız yazı rengini değiştirmek
   birim renginde yazıyı mavi zeminde bırakıyordu (okunmuyordu). */
.rp-birim.is-on.r-brand   { background:var(--brand-soft);   border-color:var(--brand);   color:var(--brand) }
.rp-birim.is-on.r-purple  { background:var(--purple-soft);  border-color:var(--purple);  color:var(--purple) }
.rp-birim.is-on.r-success { background:var(--success-soft); border-color:var(--success); color:var(--success) }
.rp-birim.is-on.r-warning { background:var(--warning-soft); border-color:var(--warning); color:var(--warning) }
.rp-birim.is-on.r-accent  { background:var(--accent-soft);  border-color:var(--accent);  color:var(--accent) }
.rp-birim.is-on.r-danger  { background:var(--danger-soft);  border-color:var(--danger);  color:var(--danger) }

/* ---------- MÜŞTERİ · SATIŞ SEKMESİ ---------- */
/* Aşama, tablo içinde renk noktasıyla gösterilir: pipeline'daki aşama
   renkleriyle AYNI değişkenler kullanılır (bkz. satis.stages) — kullanıcı
   "mor = müzakere" eşlemesini iki ekranda ayrı ayrı öğrenmemeli. */
.sf-asama{display:inline-flex;align-items:center;gap:7px;white-space:nowrap;
  font-size:12.5px;font-weight:600;color:var(--ink)}
.sf-asama i{width:8px;height:8px;border-radius:50%;flex-shrink:0}

.sf-sorumlu{display:flex;align-items:center;gap:10px;padding:9px 0;
  border-bottom:1px solid var(--line)}
.sf-sorumlu:last-of-type{border-bottom:0}
.sf-sorumlu-meta{min-width:0;display:flex;flex-direction:column;gap:1px}
.sf-sorumlu-meta b{font-size:13px;font-weight:650;color:var(--ink);line-height:1.3}
.sf-sorumlu-meta a{font-size:11.5px;color:var(--muted);text-decoration:none;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sf-sorumlu-meta a:hover{color:var(--brand)}

/* Kimlik kartı içindeki katlanır düzenleme bloğu (owner iletişimi). */
.ws-owner-duzenle{margin-top:12px;padding-top:12px;border-top:1px solid var(--line)}
.ws-owner-duzenle summary{cursor:pointer;font-size:12.5px;font-weight:600;color:var(--brand);
  display:flex;align-items:center;gap:8px;list-style:none}
.ws-owner-duzenle summary::-webkit-details-marker{display:none}
.ws-owner-duzenle summary::before{content:"";width:6px;height:6px;flex-shrink:0;
  border-right:1.6px solid currentColor;border-bottom:1.6px solid currentColor;
  transform:rotate(-45deg);transition:transform .18s}
.ws-owner-duzenle[open] summary::before{transform:rotate(45deg)}
.ws-owner-duzenle form{margin-top:12px}

/* Lead satır menüsündeki eleme formu: sebep alanı düğmenin üstünde. */
.dd-elendi{padding:6px 10px 2px}
.dd-elendi .input{width:100%;font-size:12.5px;padding:6px 9px;margin-bottom:4px}

/* ---------- DUYURU · İÇERİK BLOKLARI ---------- */
/* Girdi alanları çıktısına benzetiliyor: blok listesinin kendisi bir
   önizleme oluyor, kullanıcı "vurgu kutusu neydi" diye sağdaki panele
   bakmak zorunda kalmıyor. Renkler duyuru.HTML çıktısıyla aynı. */
.dz-blok-arac button svg{width:13px;height:13px;fill:none;stroke:currentColor;
  stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.dz-blok-arac button:disabled{opacity:.3;cursor:default}
.dz-blok-arac button:disabled:hover{border-color:var(--line);color:inherit}

.dz-g-baslik{font-size:17px;font-weight:650;color:var(--ink)}
.dz-g-uyari{border-left:3px solid var(--brand);background:var(--brand-soft);
  border-radius:0 8px 8px 0}
.dz-g-buton{font-weight:600}
.dz-g-liste{font-family:inherit}
.dz-ayrac-onizleme hr{border:none;border-top:1px solid var(--line);margin:8px 0}
.dz-gorsel-onizleme{margin-top:8px}
.dz-gorsel-onizleme img{max-width:100%;max-height:150px;border-radius:8px;display:block}

/* Ekleme paleti: her tip küçük bir şekille kendini anlatır. */
.dz-ekle{display:flex;gap:8px;flex-wrap:wrap;align-items:stretch;margin-top:14px;
  padding-top:14px;border-top:1px solid var(--line)}
.dz-ekle-baslik{width:100%;font-size:11px;font-weight:700;letter-spacing:.06em;
  text-transform:uppercase;color:var(--muted);margin-bottom:2px}
.dz-ekle-btn{display:flex;align-items:center;gap:9px;padding:8px 11px;text-align:left;
  border:1px solid var(--line);border-radius:9px;background:var(--card);cursor:pointer;
  transition:border-color .15s,box-shadow .15s}
.dz-ekle-btn:hover{border-color:var(--brand);box-shadow:var(--shadow)}
.dz-ekle-meta{display:flex;flex-direction:column;gap:1px;min-width:0}
.dz-ekle-meta b{font-size:12.5px;font-weight:650;color:var(--ink);line-height:1.25}
.dz-ekle-meta span{font-size:11px;color:var(--muted);line-height:1.3}
.dz-ekle-sekil{width:30px;height:24px;border-radius:5px;background:var(--bg);
  border:1px solid var(--line);flex-shrink:0;position:relative;overflow:hidden}
.dz-ekle-sekil::before,.dz-ekle-sekil::after{content:"";position:absolute;
  background:var(--muted);border-radius:1px}
/* Başlık: bir kalın kısa çizgi */
.dz-s-baslik::before{left:5px;top:7px;width:14px;height:3px;background:var(--ink)}
.dz-s-baslik::after{left:5px;top:13px;width:20px;height:2px}
/* Paragraf: iki ince satır */
.dz-s-metin::before{left:5px;top:8px;width:20px;height:2px}
.dz-s-metin::after{left:5px;top:13px;width:15px;height:2px}
/* Liste: madde noktası + satır */
.dz-s-liste::before{left:5px;top:8px;width:3px;height:3px;border-radius:50%}
.dz-s-liste::after{left:11px;top:8px;width:14px;height:2px}
/* Düğme: dolu kutu */
.dz-s-buton::before{left:6px;top:8px;width:18px;height:9px;border-radius:3px;background:var(--brand)}
.dz-s-buton::after{display:none}
/* Vurgu kutusu: sol şerit + zemin */
.dz-s-uyari::before{left:5px;top:6px;width:3px;height:12px;background:var(--brand)}
.dz-s-uyari::after{left:10px;top:6px;width:15px;height:12px;border-radius:2px;background:var(--brand-soft)}
/* Görsel: çerçeve + tepe */
.dz-s-gorsel::before{left:6px;top:6px;width:18px;height:12px;border-radius:2px;background:var(--accent-soft)}
.dz-s-gorsel::after{left:10px;top:12px;width:6px;height:6px;border-radius:50%;background:var(--accent)}
/* Ayraç: tek çizgi */
.dz-s-ayrac::before{left:5px;top:11px;width:20px;height:2px}
.dz-s-ayrac::after{display:none}

/* ---------- TELEFON REHBERİ ---------- */
/* Panel zil paneliyle aynı kabuğu kullanır (.zil-panel); farkı üstteki arama
   kutusu ve satır düzeni. Numara tek dokunuşla aranabilir olmalı: satırın
   sağındaki numara tel: bağlantısıdır, yanındaki düğme panoya kopyalar. */
.reh-panel{width:420px}
.reh-ara{display:flex;align-items:center;gap:8px;padding:10px 12px;border-bottom:1px solid var(--line);background:var(--bg)}
.reh-ara svg{width:16px;height:16px;flex:none;fill:none;stroke:var(--muted);stroke-width:1.6;stroke-linecap:round}
.reh-ara input{flex:1;border:0;background:none;font:inherit;font-size:13px;color:var(--ink);outline:none}
.reh-satir{display:flex;align-items:center;gap:10px;padding:10px 14px;border-bottom:1px solid var(--line)}
.reh-satir:last-child{border-bottom:0}
.reh-satir:hover{background:var(--bg)}
.reh-bilgi{flex:1;min-width:0}
.reh-ad{display:flex;align-items:center;gap:7px;font-size:13px;font-weight:600;color:var(--ink)}
.reh-kaynak{font-size:10px;font-weight:700;letter-spacing:.02em;text-transform:uppercase;
  padding:1px 6px;border-radius:999px;background:var(--brand-soft);color:var(--brand)}
.reh-kaynak.k-musteri{background:var(--success-soft);color:var(--success)}
.reh-kaynak.k-kanal{background:var(--warning-soft);color:var(--warning)}
.reh-kaynak.k-ekip{background:var(--line);color:var(--muted)}
.reh-tel{display:flex;align-items:center;gap:6px;flex:none}
.reh-tel a{font-size:13px;font-weight:600;color:var(--brand);text-decoration:none;white-space:nowrap}
.reh-tel a:hover{text-decoration:underline}
.reh-kopya{display:flex;align-items:center;justify-content:center;width:26px;height:26px;
  border:1px solid var(--line);border-radius:6px;background:var(--card);cursor:pointer}
.reh-kopya svg{width:14px;height:14px;fill:none;stroke:var(--muted);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.reh-kopya:hover{border-color:var(--brand)}
.reh-kopya:hover svg{stroke:var(--brand)}
/* Numara satır kırmasın: "0533 000 11 22" iki satıra bölününce okunmuyor. */
.reh-tel-h a{white-space:nowrap}
.reh-aksiyon{display:flex;align-items:center;justify-content:flex-end;gap:4px}

/* Lead panosunda sonuçlanmış kolonların zaman penceresi satırı: kolon son 30
   günü gösterir, toplam adet ve tam listeye bağlantı başlığın altında durur. */
.kb-pencere{display:flex;align-items:center;gap:8px;padding:0 12px 8px;
  font-size:11.5px;color:var(--muted);border-bottom:1px solid var(--line)}
.kb-pencere b{color:var(--ink);font-weight:600}
.kb-pencere a{margin-left:auto;color:var(--brand);text-decoration:none;font-weight:600;white-space:nowrap}
.kb-pencere a:hover{text-decoration:underline}

/* ---------- FORM SATIRI (duyurular, banka) ----------
   Bu üç sınıf şablonlarda kullanılıyordu ama CSS'i hiç yazılmamıştı: etiketler
   alanlara yapışıyor, "iki kolon" satırları alt alta çiziliyor, kartın içindeki
   bölümler birbirine giriyordu. Panelin geri kalanı .field kullanıyor; buradaki
   ölçüler onunla aynı tutuldu ki iki ekran arasında hizalama farkı olmasın. */
.form-row{margin-bottom:14px}
.form-row:last-child{margin-bottom:0}
.form-row-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 14px}
.form-label{display:block;font-size:12px;font-weight:500;color:var(--muted);margin-bottom:6px}
.form-label b{color:var(--danger);font-weight:600}
.form-label .cell-sub{display:inline;margin-left:2px}

/* .input tek satırlık alan için 36px yükseklik veriyor; aynı sınıf textarea'ya
   uygulandığında rows="8" yazsanız bile alan iki satır görünüyordu (duyuru
   notu, hızlı e-posta mesajı). Metin alanı satır sayısına göre büyümeli. */
textarea.input{height:auto;min-height:72px;padding:9px 12px;line-height:1.5;resize:vertical}
@media (max-width:900px){.form-row-2{grid-template-columns:1fr}}

/* .table-card doğrudan kart gövdesi taşıdığında başlık ile gövdenin sol kenarı
   aynı hizada olmalı; .card-head kendi başına padding'siz, çünkü normalde
   padding'li .card içinde duruyor.
   Kural sınıfla İSTENİR (tc-baslik): aynı yapı tablo taşıyan kartlarda da var ve
   oralarda başlığın alt boşluğu tabloyu ayıran tek şey — hepsini birden
   değiştirmek o ekranlarda başlığı tabloya yapıştırırdı. */
.card-head.tc-baslik{padding:14px 16px 0;margin-bottom:0}
.tc-govde{padding:14px 16px}
.card-head.tc-baslik + .tc-govde{padding-top:12px}
.tc-govde + .tc-govde{border-top:1px solid var(--line)}

/* ---------- KULLANILDIĞI HÂLDE TANIMSIZ KALMIŞ SINIFLAR ----------
   Şablonlar bu sınıfları kullanıyordu ama CSS'leri yazılmamıştı. Tarayıcı
   tanımadığı sınıfı sessizce yok sayar: ekran "biçimsiz" görünür, hiçbir yerde
   hata çıkmaz. Aşağıdakiler kaynağı taranıp tek tek doğrulandı. */

/* Rapor grafik ızgarası. Kart üzerindeki .rs-grafik/.rs-genis kuralları
   grid-column ile yazılmış — yani kap ızgara olmalı; olmadığı için her grafik
   tam genişlikte alt alta çiziliyor ve çizgi grafikler boşlukta yüzüyordu.
   Kırılım ızgarasıyla (.rs-iki) aynı ölçüler kullanıldı. */
.rs-grafikler{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(360px,1fr));align-items:start}
.rs-grafikler > .card.rs-genis{grid-column:1/-1}

/* Etiket–değer çiftleri (duyuru detayı, erişim izinleri kaydı). */
.detay-grid{display:grid;gap:12px 18px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.detay-grid > div{min-width:0}
.detay-grid .cell-sub{display:block;margin-bottom:2px}

/* Başlıklı modal (ekip üyesi kutusu): .modal zaten padding veriyor, bu üç
   parça yalnız iç ritmi kuruyor. */
.modal-head{display:flex;align-items:flex-start;gap:10px;margin-bottom:16px}
.modal-head .modal-title{margin-bottom:0}
.modal-close{margin-left:auto;display:flex;align-items:center;justify-content:center;
  width:28px;height:28px;flex:none;border:0;border-radius:8px;background:none;cursor:pointer}
.modal-close svg{width:16px;height:16px;fill:none;stroke:var(--muted);stroke-width:1.6;stroke-linecap:round}
.modal-close:hover{background:var(--bg)}
.modal-close:hover svg{stroke:var(--ink)}
.modal-body{margin-bottom:20px}
.modal-foot{display:flex;justify-content:flex-end;gap:12px}

/* Tablo satırında ad + monogram. */
.cell-ad{display:flex;align-items:center;gap:8px;min-width:0}

/* Küçük seçim kutusu (tablo satırı içinde). */
.select-sm{height:30px;font-size:12px;padding:0 26px 0 10px;background-position:right 8px center}

/* Slide-over başlığının üstündeki tür etiketi. */
.so-ust{font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);margin-bottom:2px}

/* Sohbet penceresi başlık düğmeleri. */
.sk-tam,.sk-kapat{display:flex;align-items:center;justify-content:center;width:26px;height:26px;
  border:0;border-radius:7px;background:none;color:var(--muted);font-size:13px;line-height:1;
  text-decoration:none;cursor:pointer}
.sk-tam:hover,.sk-kapat:hover{background:rgba(255,255,255,.14);color:#fff}

/* Genel yardımcılar: şablonlarda tek tük kullanılıyor. */
.muted{color:var(--muted)}
.hint{display:block;font-size:11.5px;font-weight:500;color:var(--muted);margin-top:4px;line-height:1.45}
.ht-kuran,.ht-kisi{font-size:11px;font-weight:500;color:var(--muted)}

/* ---------- SERBEST E-POSTA: EK LİSTESİ VE ÖNİZLEME ---------- */
.he-dosya{height:auto;padding:8px 10px;line-height:1.4}
.he-ek-liste{margin-top:8px;display:flex;flex-direction:column;gap:6px}
.he-ek-satir{display:flex;align-items:center;gap:10px;padding:7px 10px;
  border:1px solid var(--line);border-radius:8px;background:var(--bg);font-size:12.5px}
.he-ek-ad{font-weight:600;color:var(--ink);min-width:0;overflow-wrap:anywhere}
.he-ek-satir .cell-sub{margin-left:auto;white-space:nowrap}
.he-oniz-baslik{display:flex;align-items:center;gap:10px;margin-bottom:6px}
.he-oniz-baslik .btn{margin-left:auto}
.he-oniz-kutu{border:1px solid var(--line);border-radius:9px;background:var(--bg);
  overflow:hidden}
.he-oniz-ust{display:flex;flex-direction:column;gap:2px;padding:10px 12px;
  border-bottom:1px solid var(--line);background:var(--card);font-size:13px}
/* İleti önizlemesi kendi belgesinde çizilir (iframe): panel CSS'i iletinin
   tablolarını bozmasın ve 560 piksellik ileti panele sığmadan yarım
   görünmesin. Ölçek app.js'te hesaplanır — kapsayıcının genişliğine göre. */
.he-oniz-sar{position:relative;overflow:hidden;background:#f4f6fa}
.he-oniz-cerceve{display:block;border:0;width:600px;transform-origin:top left;
  background:#f4f6fa}
/* Önizlemeyi büyüt: saydam düğme iframe'i tamamen örter (iframe içine giden
   tıklama dış sayfaya ulaşmıyor). Etiket yalnız üzerine gelince çıkıyor ki
   önizlemenin kendisini kapatmasın. */
.he-oniz-buyut{position:absolute;inset:0;width:100%;border:0;background:transparent;
  cursor:zoom-in;padding:0;display:flex;align-items:flex-start;justify-content:flex-end}
.he-oniz-buyut span{display:inline-flex;align-items:center;gap:5px;margin:8px;
  padding:5px 9px;border-radius:7px;background:rgba(15,32,55,.82);color:#fff;
  font-size:11.5px;font-weight:600;opacity:0;transition:opacity .13s}
.he-oniz-buyut svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:1.7;
  stroke-linecap:round;stroke-linejoin:round}
.he-oniz-buyut:hover span,.he-oniz-buyut:focus-visible span{opacity:1}

/* Büyük önizleme penceresi: ileti gerçek genişliğinde, panel kromu olmadan. */
.oniz-buyut .ob-modal{max-width:min(96vw,760px);padding:0;overflow:hidden;
  display:flex;flex-direction:column;max-height:calc(100vh - 48px)}
.ob-ust{display:flex;align-items:center;gap:12px;padding:11px 14px;
  border-bottom:1px solid var(--line);background:var(--card)}
.ob-baslik{display:flex;flex-direction:column;gap:2px;min-width:0}
.ob-baslik b{font-size:14px;color:var(--ink);overflow-wrap:anywhere}
.ob-arac{display:flex;align-items:center;gap:6px;margin-left:auto}
.ob-en{border:1px solid var(--line);background:var(--card);color:var(--muted);
  border-radius:7px;padding:4px 10px;font-size:11.5px;font-weight:600;cursor:pointer}
.ob-en.is-acik{border-color:var(--primary);color:var(--primary);background:var(--bg)}
.ob-kapat{border:0;background:transparent;color:var(--muted);font-size:15px;
  cursor:pointer;padding:2px 6px;line-height:1}
.ob-govde{overflow:auto;background:#f4f6fa;padding:16px;display:flex;justify-content:center}
/* Yükseklik içerikten okunuyor (JS), ölçek yok: "büyük hâl" iletinin gerçek
   boyutu demek. */
.ob-cerceve{border:0;width:640px;max-width:100%;height:60vh;background:#fff;
  border-radius:8px;box-shadow:0 1px 4px rgba(15,49,86,.12)}

.he-ekler{padding:9px 12px;border-top:1px solid var(--line);font-size:12px;color:var(--muted)}
.he-ekler b{color:var(--ink)}

/* Sohbet balonu (z-index:90) slide-over'ın (75) üstünde duruyor ve panelin
   alt aksiyonlarını kapatıyordu — "Gönder" düğmesinin yarısı balonun altında
   kalıyordu. Panel açıkken balon gizlenir; iki yüzen öğe aynı köşeyi paylaşamaz. */
body.so-open .sk-dugme{display:none}

/* ═══════════════ ARANABİLİR SEÇİM ═══════════════
   Uzun açılır listelerde (523 firma, 355 müşteri…) seçenek aramak için.
   Yerli <select> DOM'da kalır: form gönderimi, "required" denetimi ve
   .value okuyan mevcut JS aynen çalışsın diye. Görünmez ama ölçülebilir
   tutulur — display:none olsaydı tarayıcı "geçersiz alan odaklanamıyor"
   diyip formu hiç göndermezdi. */
.as-sar{position:relative}
.as-gizli{position:absolute;left:0;bottom:0;width:100%;height:1px;opacity:0;
  pointer-events:none;padding:0;border:0;margin:0}
.as-girdi{width:100%;cursor:text}
/* Seçili değer kutuya sığmadığında ortasından kesiliyordu (text-overflow
   varsayılanı clip): "Yalnız görüntüleme — Kayıtlar görülür, değişiklik
   yapılamaz." ekranda "Yalnız görüntüleme — Kayıt" diye bitiyor, devamı
   olduğu anlaşılmıyordu. */
.as-girdi.as-secili{font-weight:500;text-overflow:ellipsis}

/* Bir <select> yerine geçen kutu: ok işareti onun tıklanabilir bir liste
   olduğunu söyler. Gerçek <select> gizlendiği için .select sınıfının arka
   plan oku da kayboluyordu; ok buraya taşındı ve tüm listelerde aynı.
   Kutunun kendisi ok alanının altına yazmasın diye sağdan boşluk bırakılıyor. */
.as-sar-sec{position:relative}
.as-sar-sec .as-girdi{padding-right:32px}
.as-sar-sec::after{
  content:"";position:absolute;right:10px;top:50%;width:16px;height:16px;
  margin-top:-8px;pointer-events:none;transition:transform .15s;
  background:no-repeat center/16px 16px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 20 20' fill='none' stroke='%235B7089' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 8l5 5 5-5'/%3E%3C/svg%3E");
}
/* Liste açıkken ok yukarı bakar: kutunun durumu okunur olsun. */
.as-sar-sec:has(.as-girdi[aria-expanded="true"])::after{transform:rotate(180deg)}

/* Kısa liste: kutu bir tetikleyici, metin alanı değil. */
.as-sar-kisa .as-girdi{cursor:pointer;user-select:none}
.as-sar-kisa .as-girdi::selection{background:transparent}
/* Konum JS ile veriliyor (position:fixed): kutunun kabı kaydırmalıysa
   mutlak konumlu liste kırpılıyordu. z-index modalın (80) üstünde. */
.as-liste{position:fixed;z-index:120;max-height:280px;overflow-y:auto;
  background:var(--card);border:1px solid var(--line);
  border-radius:9px;box-shadow:var(--shadow);padding:4px;display:none}
.as-liste.acik{display:block}

/* Satır seçilebilir GÖRÜNMELİ: tarayıcının kendi datalist açılırı düz bir
   metin yığınıydı, tıklanabilir olduğu anlaşılmıyordu. Sabit genişlikte bir
   işaret sütunu + belirgin vurgu, satırı düğme gibi okutur. İşaret sütunu
   seçili olmayan satırlarda da YER KAPLAR: yoksa seçim değiştikçe adlar
   yatayda oynar ve liste titrer. */
.as-secenek{display:flex;align-items:center;gap:7px;padding:9px 10px;border-radius:7px;
  font-size:13.5px;color:var(--ink);cursor:pointer;line-height:1.35}
.as-secenek .as-ad{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.as-tik{flex:none;width:13px;text-align:center;font-size:12px;opacity:0}
.as-tik::before{content:"✓"}
.as-secenek:hover,.as-secenek.imlec{background:var(--brand-soft);color:var(--brand)}
.as-secenek.is-secili{font-weight:650;color:var(--brand)}
.as-secenek.is-secili .as-tik{opacity:1}
.as-bos{padding:10px;font-size:12.5px;color:var(--muted)}
.as-sayac{padding:6px 10px 8px;font-size:11.5px;color:var(--muted);border-top:1px solid var(--line);margin-top:4px}

/* "Listede yok — yeni açılacak" satırı. Ayrı bir kutu değil, listenin son
   satırı: kullanıcı zaten oraya bakıyor ve seçim ile oluşturma aynı hareket.
   Kesikli çizgi, mevcut kayıtlarla yeni kaydı ayırır. */
.as-secenek.as-yeni{border-top:1px dashed var(--line);border-radius:0 0 7px 7px;
  margin-top:4px;padding-top:11px;color:var(--brand)}
.as-secenek.as-yeni.as-tek{border-top:0;border-radius:7px;margin-top:0;padding-top:9px}
.as-secenek.as-yeni .as-ad{font-weight:600}
.as-secenek.as-yeni .as-ad::before{content:"“"}
.as-secenek.as-yeni .as-ad::after{content:"”"}
.as-arti{flex:none;display:inline-flex;align-items:center;justify-content:center;
  width:16px;height:16px;border-radius:5px;background:var(--brand);color:#fff;
  font-size:12px;font-weight:700;line-height:1}
.as-rozet{flex:none;font-size:10.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;
  padding:2px 7px;border-radius:999px;background:var(--brand-soft);color:var(--brand)}
.as-secenek.as-yeni:hover,.as-secenek.as-yeni.imlec{background:var(--brand-soft)}

/* Duyuru kitlesi: elle firma seçimi */
.dz-kitle-kip{gap:10px}
.dz-firma-liste{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.dz-firma-liste:empty{display:none}
.dz-firma-cip{display:inline-flex;align-items:center;gap:8px;padding:6px 8px 6px 12px;
  border:1px solid var(--line);border-radius:999px;background:var(--card);
  font-size:12.5px;font-weight:600;color:var(--ink)}
.dz-firma-sil{border:0;background:transparent;color:var(--muted);font-size:16px;
  line-height:1;cursor:pointer;padding:0 2px;border-radius:50%}
.dz-firma-sil:hover{color:var(--danger)}

/* Modal içindeki kalem tablosu dar alana sığmalı: taşan satırda son sütun
   (kaldır düğmesi) görünmüyordu. */
.modal .line-items{display:block;overflow-x:auto}
.modal .line-items .input,.modal .line-items .select{min-width:0}

/* ─────────────────────────────────────────────────────────────────────────
   KAYNAKLAR — Eğitim & SSS
   Eski tasarımda 36 materyal tek düz ızgarada, 42 soru tek akordeonda
   duruyordu; kategori küçük gri bir etiketti. Göz nereye bakacağını
   bilemiyordu. Yeni düzen üç kademeli: tür şeridi → konu şeridi → başlıklı
   öbekler. Süzgeçler adres satırında taşınır, yani paylaşılabilir.
   ───────────────────────────────────────────────────────────────────────── */

.kyn-ust{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-bottom:12px}
.kyn-ust > *{min-width:0}

.kyn-ara{position:relative;flex:1 1 320px;display:flex;align-items:center}
.kyn-ara svg{
  position:absolute;left:13px;width:17px;height:17px;pointer-events:none;
  stroke:var(--muted);fill:none;stroke-width:1.6;stroke-linecap:round
}
.kyn-ara input{
  width:100%;height:42px;padding:0 14px 0 38px;border:1px solid var(--line);
  border-radius:9px;background:var(--card);color:var(--ink);
  font-family:inherit;font-size:14px
}
.kyn-ara input:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}

/* Tür şeridi: segment düğmesi görünümü — dört seçenek birbirini dışlar. */
.kyn-serit{display:flex;gap:2px;padding:3px;background:var(--bg);border-radius:10px;flex-wrap:wrap}
.kyn-tip{
  display:inline-flex;align-items:center;gap:7px;padding:7px 13px;border-radius:7px;
  font-size:13px;font-weight:600;color:var(--muted);text-decoration:none;white-space:nowrap
}
.kyn-tip b{
  font-weight:600;font-size:11.5px;padding:1px 6px;border-radius:20px;
  background:var(--line);color:var(--muted);font-variant-numeric:tabular-nums
}
.kyn-tip:hover{color:var(--ink)}
.kyn-tip.is-on{background:var(--card);color:var(--navy);box-shadow:0 1px 3px rgba(15,49,86,.12)}
.kyn-tip.is-on b{background:var(--brand-soft);color:var(--brand)}
/* Sonucu olmayan tür soluk ama tıklanabilir kalır: gizlemek "böyle bir tür
   yok" izlenimi verirdi. */
.kyn-tip.is-bos{opacity:.45}

/* Konu şeridi — TEK SATIR, taşarsa yatay kayar.
   Sarmalı bırakınca 15 konu iki satır pill'e dönüşüyor ve ekranın üstünü
   gürültüyle dolduruyordu. Öbek başlıkları zaten ikinci bir dizin görevi
   görüyor; bu şerit hızlı süzgeç olarak kalmalı, sayfayı yönetmemeli. */
.kyn-kat{
  display:flex;gap:7px;margin-bottom:14px;overflow-x:auto;padding-bottom:4px;
  scrollbar-width:thin;-webkit-overflow-scrolling:touch
}
.kyn-kat::-webkit-scrollbar{height:5px}
.kyn-kat::-webkit-scrollbar-thumb{background:var(--line);border-radius:3px}
.kyn-kat > *{flex:0 0 auto}
.kyn-katoge{
  white-space:nowrap;display:inline-flex;align-items:center;gap:6px;padding:5px 11px;border-radius:20px;
  border:1px solid var(--line);background:var(--card);color:var(--muted);
  font-size:12.5px;font-weight:500;text-decoration:none
}
.kyn-katoge span{color:var(--muted);font-size:11px;font-variant-numeric:tabular-nums}
.kyn-katoge:hover{border-color:var(--brand);color:var(--navy)}
.kyn-katoge.is-on{background:var(--navy);border-color:var(--navy);color:#fff}
.kyn-katoge.is-on span{color:rgba(255,255,255,.7)}

.kyn-ozet{
  display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin-bottom:20px;
  padding-bottom:12px;border-bottom:1px solid var(--line);
  font-size:13px;color:var(--muted)
}
.kyn-ozet b{color:var(--ink);font-weight:650;font-variant-numeric:tabular-nums}
.kyn-temizle{font-size:12.5px;font-weight:600;color:var(--brand);text-decoration:none}
.kyn-temizle:hover{text-decoration:underline}
.kyn-ekle{margin-left:auto;display:flex;gap:12px}
.kyn-ekle a{font-size:12.5px;font-weight:600;color:var(--brand);text-decoration:none}

/* Bölüm ve öbek başlıkları */
.kyn-bolum{margin-bottom:34px}
.kyn-bolum-bas{
  display:flex;align-items:center;gap:9px;margin:0 0 16px;
  font-size:16px;font-weight:700;letter-spacing:-.01em;color:var(--navy)
}
.kyn-bolum-bas span{
  font-size:11.5px;font-weight:600;padding:2px 8px;border-radius:20px;
  background:var(--brand-soft);color:var(--brand);font-variant-numeric:tabular-nums
}
.kyn-grup{margin-bottom:22px}
.kyn-grup-bas{
  display:flex;align-items:center;gap:8px;margin:0 0 10px;
  font-size:11.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)
}
.kyn-grup-bas i{font-style:normal;font-weight:600;color:var(--muted);opacity:.7}
.kyn-grup-bas::after{content:"";flex:1;height:1px;background:var(--line)}

/* Kartlar */
.kyn-kartlar{display:grid;grid-template-columns:repeat(auto-fill,minmax(238px,1fr));gap:10px}
.kyn-kartlar > *{min-width:0}
.kyn-kart{
  display:flex;flex-direction:column;gap:7px;padding:14px 15px;
  border:1px solid var(--line);border-radius:10px;background:var(--card);
  text-decoration:none;transition:border-color .12s,box-shadow .12s,transform .12s
}
.kyn-kart:hover{
  border-color:var(--brand);box-shadow:0 4px 14px rgba(15,49,86,.09);transform:translateY(-1px)
}
.kyn-kart-tur{
  display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:600;
  letter-spacing:.05em;text-transform:uppercase;color:var(--muted)
}
.kyn-kart-tur svg{width:14px;height:14px;fill:currentColor;stroke:none;flex-shrink:0}
.kyn-kart-tur b{
  margin-left:auto;font-size:11px;font-weight:600;letter-spacing:0;text-transform:none;
  padding:1px 7px;border-radius:20px;background:var(--bg);color:var(--muted);
  font-variant-numeric:tabular-nums
}
.kyn-kart.k-video .kyn-kart-tur{color:var(--danger)}
.kyn-kart-bas{font-size:14px;font-weight:650;line-height:1.35;color:var(--ink)}
.kyn-kart-not{font-size:12.5px;line-height:1.5;color:var(--muted)}

/* Soru-cevap */
.kyn-sss{display:flex;flex-direction:column;gap:6px}
.kyn-soru{
  border:1px solid var(--line);border-radius:9px;background:var(--card);overflow:hidden
}
.kyn-soru summary{
  display:flex;align-items:center;gap:10px;padding:12px 15px;cursor:pointer;
  font-size:13.5px;font-weight:600;color:var(--ink);list-style:none
}
.kyn-soru summary::-webkit-details-marker{display:none}
.kyn-soru summary::after{
  content:"";margin-left:auto;flex-shrink:0;width:8px;height:8px;
  border-right:1.6px solid var(--muted);border-bottom:1.6px solid var(--muted);
  transform:rotate(45deg) translateY(-2px);transition:transform .15s
}
.kyn-soru[open] summary::after{transform:rotate(-135deg) translateY(-2px)}
.kyn-soru:hover{border-color:var(--brand)}
.kyn-soru[open]{border-color:var(--brand)}
.kyn-cevap{
  padding:0 15px 14px 15px;font-size:13.5px;line-height:1.65;color:var(--muted);
  max-width:78ch
}

@media (max-width:767px){
  .kyn-serit{width:100%}
  .kyn-tip{flex:1 1 auto;justify-content:center;padding:8px 10px}
  .kyn-kartlar{grid-template-columns:1fr}
  .kyn-ekle{margin-left:0}
}

/* Dosyalar — Eğitim & SSS ile aynı düzen; liste tablo kalıyor çünkü boyut,
   sürüm, sahip ve tarih sütunlu okunmalı. Kartlara çevirmek bu bilgiyi
   kaybettirirdi. */
/* Öbek başlığı, tablo gövdesinde tam genişlikte bir satır. */
.dsy-grup-satir td{
  padding:14px 14px 7px!important;background:transparent!important;border-bottom:1px solid var(--line)
}
.dsy-grup-satir span{
  font-size:11.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)
}
.dsy-grup-satir i{
  font-style:normal;margin-left:8px;font-size:11.5px;font-weight:600;color:var(--muted);opacity:.7
}
.dsy-grup-satir:first-child td{padding-top:8px!important}
@media (max-width:767px){
  /* Mobilde tablo satırları karta dönüşüyor; öbek başlığı da kart gibi
     görünüp boş bir kutu oluşturuyordu. Kart giysisini soyup bölüm etiketi
     olarak bırakıyoruz. */
  .data-table tbody tr.dsy-grup-satir{
    display:block;background:transparent;border:0;box-shadow:none;
    margin:18px 0 6px;padding:0
  }
  .dsy-grup-satir td{
    display:block;padding:0 2px 6px!important;border-bottom:1px solid var(--line)
  }
  .dsy-grup-satir td::before{content:none!important}
}

/* Yükleme formu açılır kapanır: bu ekrana gelenlerin çoğu dosya ARIYOR. */
.dsy-yukle{
  border:1px solid var(--line);border-radius:10px;background:var(--card);
  margin-bottom:24px;overflow:hidden
}
.dsy-yukle > summary{
  display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;padding:13px 16px;
  cursor:pointer;font-size:13.5px;font-weight:650;color:var(--ink);list-style:none
}
.dsy-yukle > summary::-webkit-details-marker{display:none}
.dsy-yukle > summary span{font-size:12px;font-weight:450;color:var(--muted)}
.dsy-yukle > summary::before{
  content:"+";margin-right:2px;font-size:15px;font-weight:600;color:var(--brand);
  line-height:1
}
.dsy-yukle[open] > summary::before{content:"−"}
.dsy-yukle > summary:hover{background:var(--bg)}
.dsy-yukle[open] > summary{border-bottom:1px solid var(--line)}
.dsy-yukle .form-grid{padding:16px}

/* Paket kartının alt eylem şeridi: "Sil" ve "Aç" yan yana. */
.pk-alt-eylem{display:flex;align-items:center;gap:6px}
.pk-alt-eylem form{margin:0}

/* Yeni paket formunda "YENİ ÜRÜN" uyarısı: yazılan ad katalogda yoksa
   kaydetmenin ürün de açacağını önceden söyler. */
.urun-yeni{
  display:inline-block;margin-left:6px;padding:1px 7px;border-radius:20px;
  background:var(--warning-soft);color:var(--warning);
  font-size:10px;font-weight:700;letter-spacing:.06em;vertical-align:middle
}
.field-help.is-yeni{color:var(--warning);font-weight:500}


/* p-none: oranı hesaplanamayan ilerleme barı (sınırsız koltuk, girilmemiş
   kullanım). Renkli bir bar %0'ı "boş" diye okutur; nötr ve boş bırakılır. */
.p-none{background:transparent}
/* Koltuk kutusu sınırsıza kilitlendiğinde: değer değiştirilemez. */
.input.is-sinirsiz{background:var(--bg);color:var(--muted);cursor:not-allowed}

/* ═══════════ PAKET: KAPASİTE, ÖZELLİK, KDV ═══════════ */

/* Kapasite ızgarası. .form-grid iki sabit sütun; altı kapasite alanı orada
   dar ekranda taşıyor, geniş ekranda ise sağda boşluk bırakıyordu. Burada
   sütun sayısı yere göre kendi ayarlanıyor. */
.kap-izgara{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
  gap:16px 20px;
}
.kap-alan{display:flex;flex-direction:column;gap:7px;min-width:0}
.kap-alan > label{
  font-size:12px;font-weight:500;color:var(--muted);
  display:flex;align-items:center;gap:5px
}
.kap-alan > label b{color:var(--danger);font-weight:600}
.kap-alan .field-help{margin-top:0}

/* "Sınırsız" seçeneği kutunun altında ayrı bir satır: yan yana dizildiğinde
   dar sütunda sayı kutusu okunamayacak kadar sıkışıyordu. */
.kap-giris{display:flex;flex-direction:column;gap:7px;align-items:stretch}
/* flex:none ŞART: dikey ızgarada flex-basis YÜKSEKLİK olur; miras alınan
   bir basis değeri sayı kutusunu 90px boyunda bir bloğa çeviriyordu. */
.kap-giris .input{flex:none;width:100%;min-width:0;height:36px}
.kap-sinirsiz{
  display:inline-flex;align-items:center;gap:7px;align-self:flex-start;
  padding:4px 10px 4px 8px;border:1px solid var(--line);border-radius:20px;
  font-size:12px;color:var(--muted);cursor:pointer;
  transition:border-color .15s,color .15s,background .15s
}
.kap-sinirsiz:hover{border-color:var(--brand);color:var(--ink)}
.kap-sinirsiz:has(input:checked){
  border-color:var(--brand);background:rgba(18,116,197,.07);
  color:var(--brand);font-weight:600
}
.kap-sinirsiz input{margin:0;flex:none}
.kap-giris .input:disabled{background:var(--bg);color:var(--muted);cursor:not-allowed}

/* Özellik kartları: çıplak onay kutusu satırı, on maddelik bir listede neyin
   ne olduğunu anlatmıyordu. Her özellik adı + tek cümlelik karşılığıyla. */
.ozellik-izgara{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
  gap:12px;
}
.oz-kart{
  display:flex;gap:11px;align-items:flex-start;
  padding:13px 15px;border:1px solid var(--line);border-radius:10px;
  cursor:pointer;transition:border-color .15s,background .15s
}
.oz-kart:hover{border-color:var(--brand)}
.oz-kart:has(input:checked){border-color:var(--brand);background:rgba(18,116,197,.05)}
.oz-kart input{margin:2px 0 0;flex:none}
.oz-govde{min-width:0}
/* span'lar satır içi: blok yapılmazsa ad ile açıklama bitişik yazılıyor
   ("Öncelikli destekDestek talepleri sırada öne alınır."). */
.oz-ad{display:block;font-size:14px;font-weight:600;color:var(--ink);line-height:1.3}
.oz-not{display:block;font-size:12px;color:var(--muted);margin-top:3px;line-height:1.45}

/* KDV gerekçe bölümü: oran %0/%1 seçilince açılır. */
.kdv-neden{
  margin-top:14px;padding:14px 16px;border-radius:10px;
  background:var(--warning-soft);border:1px solid rgba(154,100,0,.22)
}
.kdv-neden-bas{
  display:flex;align-items:center;gap:8px;
  font-size:13px;font-weight:650;color:#6B4A00;margin-bottom:10px
}
.kdv-neden-bas svg{width:16px;height:16px;flex:none;fill:none;stroke:currentColor;stroke-width:1.6}
.kdv-neden .field-help{color:#7A5600;margin-top:7px}

/* Katalog kartındaki özellik rozetleri (öncelikli destek, API, ERP…). */
.pk-rozetler{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.pk-oz{
  display:inline-flex;align-items:center;gap:5px;
  padding:3px 9px;border-radius:20px;
  background:rgba(18,116,197,.08);color:var(--brand);
  font-size:11.5px;font-weight:600;white-space:nowrap
}
.pk-kdv{
  display:inline-flex;align-items:center;gap:5px;
  padding:3px 9px;border-radius:20px;
  background:var(--warning-soft);color:#8A5B00;
  font-size:11.5px;font-weight:600;white-space:nowrap
}

/* .field label{display:block} kuralı .check-item{display:flex}'i yeniyor
   (seçici ağırlığı 0,1,1 > 0,1,0): alan içindeki onay kutusu satırında gap
   uygulanmıyor ve kutu ile metin bitişik yazılıyordu. */
.field .check-item{display:flex;align-items:center;gap:8px;margin-bottom:0}

/* Duyuru düzenleyicisinde "Şablon olarak kaydet" katlanır bölümü. Kapalıyken
   tek satır: asıl eylem Kaydet'tir, şablon ikincil bir istektir ve onun
   kadar yer kaplamamalı. */
.dz-sablon{margin-top:10px;border:1px solid var(--line);border-radius:9px;padding:0 12px}
.dz-sablon summary{
  cursor:pointer;padding:9px 0;font-size:12.5px;font-weight:600;color:var(--brand);
  list-style:none
}
.dz-sablon summary::-webkit-details-marker{display:none}
.dz-sablon summary::before{content:"+ ";font-weight:700}
.dz-sablon[open] summary::before{content:"− "}
.dz-sablon[open]{padding-bottom:12px}
.dz-sablon .input{margin-bottom:5px}
/* Şablon seçiminde çevrilemeyen parça uyarısı. */
.field-help.is-uyari{color:var(--warning);font-weight:500}

/* Onboarding adımında e-posta bölümü: kategoriye göre açılır. */
.onb-eposta{
  margin-top:14px;padding-top:14px;border-top:1px solid var(--line);
  display:flex;flex-direction:column;gap:12px
}
.onb-eposta[hidden]{display:none}
.onb-eposta .radio-card{margin-top:6px}
.onb-eposta .rc-govde{display:block;min-width:0}
.onb-eposta .rc-govde b{display:block;font-size:13px;font-weight:600}
.onb-eposta .rc-govde span{display:block;font-size:12px;color:var(--muted);margin-top:2px;line-height:1.45}
.onb-eposta-metin{height:auto;padding:10px 12px;line-height:1.55;resize:vertical}
.field-hint.is-uyari{color:var(--warning);font-weight:500}

/* ---------- e-BELGE (XSLT) ŞABLON DÜZENLEYİCİSİ ---------- */

/* Araçlar sekmesi: şablon ekleme yolları tek kartta, satır satır. */
.xs-yol{display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:14px 0;border-bottom:1px solid var(--line);flex-wrap:wrap}
.xs-yol:last-child{border-bottom:0;padding-bottom:0}
.xs-yol:first-of-type{padding-top:4px}
.xs-yol-ad{flex:1 1 340px}
.xs-yol-ad b{display:block;font-weight:600;font-size:13px;margin-bottom:2px}
.xs-yol-ad .cell-sub{display:block;max-width:640px;white-space:normal}
/* Alan + düğme TEK satırda kalsın: sarıldıklarında düğme kendi satırına
   düşüp üç yol birbirine karışıyordu. */
.xs-yol-form{display:flex;align-items:center;gap:8px;flex:0 0 auto}
.xs-yol-form .input{height:32px;font-size:12.5px;width:250px;min-width:0}

/* Şablon açıklaması, data-table'ın genel 200px kesme sınırına takılıp
   "…"le bitiyordu; bu tabloda ad kolonu geniş, açıklamaya yer var. */
.xs-tablo tbody td .cell-sub{max-width:560px}

/* Düzenleyicinin üst çubuğu. Yapışkan: şablon metni uzun, "Önizle" ve
   "Kaydet" sayfayı başa sarmadan erişilebilir olmalı. */
.xd-bar{position:sticky;top:64px;z-index:20;display:flex;flex-wrap:wrap;gap:12px;
  align-items:center;justify-content:space-between;
  background:var(--card);border:1px solid var(--line);border-radius:12px;
  padding:10px 14px;margin-bottom:14px}
.xd-bar-sol,.xd-bar-sag{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.xd-ad{font-size:14px;font-weight:650;letter-spacing:-.01em}
.xd-not-satir{font-size:11.5px;font-weight:500;color:var(--warning)}
.xd-bar .ipucu-btn{margin-left:-4px}
.xd-not-alan{height:32px;font-size:12.5px;width:240px}
.xd-bar kbd{font-family:inherit;font-size:10px;padding:1px 4px;border-radius:4px;
  border:1px solid var(--line);background:var(--bg);margin-left:2px}

/* Kaynak ile önizleme yan yana; dar ekranda alt alta. */
.xd-split{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}
@media (max-width:1180px){.xd-split{grid-template-columns:1fr}}
/* Genişletilmiş önizleme: kaynak gizlenir, belge tam genişlikte basılır
   (GİB şablonları ~800px sabit genişlikte çıkar, yarım ekranda kesilir). */
.xd-split.xd-genis{grid-template-columns:1fr}
.xd-split.xd-genis > .xd-yan:first-child{display:none}
.xd-split.xd-genis .xd-onizleme{height:78vh}

.xd-yan{background:var(--card);border:1px solid var(--line);border-radius:14px;
  overflow:hidden;display:flex;flex-direction:column}
.xd-yan-ust{display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:10px 14px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.xd-yan-arac{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.xd-ornek{height:30px;font-size:12px;max-width:250px}
.xd-xml-ad{padding:8px 14px 0;cursor:pointer}
.xd-xml-ad:empty{display:none}

/* Kod alanı: satır kaydırma KAPALI (wrap="off"). XSLT satırları uzundur;
   sarılan satır, hata mesajındaki satır numarasıyla ekrandakini ayırır. */
.xd-kod{width:100%;height:66vh;min-height:420px;border:0;outline:none;resize:vertical;
  padding:14px 16px;background:var(--card);color:var(--ink);
  font-family:ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,monospace;
  font-size:12px;line-height:1.6;tab-size:2;white-space:pre;overflow:auto}

/* Önizleme çerçevesi beyaz kalır: basılan belge beyaz kâğıttır, panelin
   teması belgeyi olduğundan başka gösterirdi. */
.xd-onizleme{width:100%;height:66vh;min-height:420px;border:0;background:#fff}

.xd-uyari,.xd-not{margin:12px 14px 0;padding:10px 12px;border-radius:10px;
  font-size:12px;line-height:1.5}
.xd-uyari{background:var(--danger-soft);border:1px solid var(--danger);color:var(--danger)}
.xd-not{background:var(--warning-soft);border:1px solid var(--line);color:var(--warning)}
.xd-uyari b{display:block;margin-bottom:4px}
/* Motor uyarısı katlı: çoğu şablonda hep aynı satır çıkıyor, açık dursa
   önizlemeyi aşağı itip her seferinde bir sorun varmış gibi görünüyordu. */
.xd-not > summary{cursor:pointer;font-weight:600;list-style:none}
.xd-not > summary::-webkit-details-marker{display:none}
.xd-not > summary::after{content:" ▸";font-size:10px}
.xd-not[open] > summary::after{content:" ▾"}
.xd-not p{margin:8px 0}
.xd-uyari pre,.xd-not pre{margin:0;white-space:pre-wrap;word-break:break-word;
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:11px}

/* Seyrek dokunulan bölümler (bilgiler, geçmiş, dosya işlemleri) katlı durur:
   düzenleyici açılınca ilk görülen şey kod ve önizleme olmalı. */
.xd-katli{background:var(--card);border:1px solid var(--line);border-radius:14px;
  margin-top:14px;padding:0 20px}
.xd-katli > summary{cursor:pointer;list-style:none;padding:14px 0;
  font-size:13px;font-weight:600;display:flex;align-items:center;gap:8px}
.xd-katli > summary::-webkit-details-marker{display:none}
.xd-katli > summary::after{content:"+";margin-left:auto;font-size:18px;color:var(--muted)}
.xd-katli[open] > summary{color:var(--brand);border-bottom:1px solid var(--line)}
.xd-katli[open] > summary::after{content:"–"}
.xd-katli > *:not(summary){margin-bottom:18px;margin-top:16px}

/* Sürüm geçmişi satırları. */
.xd-surumler{display:flex;flex-direction:column}
.xd-surum{display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:12px 0;border-bottom:1px solid var(--line);flex-wrap:wrap}
.xd-surum:last-child{border-bottom:0;padding-bottom:16px}
.xd-surum-sol{display:flex;align-items:flex-start;gap:14px;flex:1 1 420px;min-width:0}
.xd-surum-no{flex:0 0 92px;font-weight:700;font-size:13px;display:flex;flex-direction:column;gap:4px;align-items:flex-start}
.xd-surum-not{font-size:12.5px;font-weight:500;margin-bottom:2px}
.xd-surum-sag{display:flex;align-items:center;gap:6px;flex:0 0 auto}

.xd-satir{display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:12px 0;border-bottom:1px solid var(--line);margin:0 !important}
.xd-satir:last-child{border-bottom:0;padding-bottom:16px}
.xd-satir b{display:block;font-size:13px;font-weight:600;margin-bottom:2px}
.xd-satir .cell-sub{display:block;white-space:normal}
.xd-satir.xd-tehlike b{color:var(--danger)}

@media (max-width:640px){
  .xd-bar{position:static}
  .xd-bar-sol,.xd-bar-sag{width:100%}
  .xd-not-alan{width:100%}
  .xd-bar-sag .btn{flex:1;justify-content:center}
}

/* KPI kartında kapsam dışı kalan tutarın notu (ör. MRR kartında cihaz GMU'ları) */
.kpi-ek{margin-top:4px;padding-top:4px;border-top:1px dashed var(--line);font-size:11.5px}

/* --- Paket karşılaştırma tablosu ---------------------------------------
   "Dahil olanlar" hücresi tüm çipleri basınca beş özellikli paketlerde
   çipler alt alta yığılıyor, satır üç katına çıkıyor ve tablo satırdan
   satıra zıplıyordu. Karşılaştırma tablosunun işi satırları yan yana
   okutmak: hücre tek satırda kalır, taşan madde sayıya döner (+N), tamamı
   title'da durur. */
.chips-tek{flex-wrap:nowrap;overflow:hidden;align-items:center}
.chips-tek{gap:3px}
.chips-tek .chip{flex:0 0 auto;max-width:100px;overflow:hidden;text-overflow:ellipsis;display:block;line-height:17px;font-size:10.5px;padding:2px 7px}
.chip-fazla{background:var(--brand-soft);border-color:transparent;color:var(--brand);font-weight:700}
/* Satırlar artık tek satırlık; içerik üstten hizalanınca çok satırlı paket
   adı ile yanındaki hücreler aynı hizadan başlar. */
.pk-tablo tbody td{vertical-align:middle;padding-top:8px;padding-bottom:8px}
.pk-tablo tbody td.td-cust{vertical-align:middle}
.pk-tablo .cust-owner-line{max-width:230px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* --- Onboarding yolculuğu · adım listesi -------------------------------
   Stepper tek satır flex'ti ve sarmıyordu: 9 adımlı şablonda 2015px'e
   uzayıp kartın ve sayfanın dışına taşıyordu (sayfa 2292px yatay kayıyordu,
   6. adımdan sonrası kartın dışında havada kalıyordu). Adımlar artık
   ızgaraya yerleşip alt satıra geçiyor; her adım kendi kutusunda, sayısı
   kaç olursa olsun kartın içinde kalıyor.
   Kural yalnız .onb-card içinde: teklif ve kanal ekranlarındaki stepper
   birkaç adımlı, tek satır görünümünü koruyor. */
.onb-card .stepper{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(196px,1fr));
  gap:8px;margin:16px 0 4px;
}
.onb-card .stepper .step-line{display:none}
.onb-card .step{
  align-items:center;gap:9px;min-width:0;
  padding:8px 10px;border:1px solid var(--line);border-radius:9px;background:var(--card);
}
.onb-card .step.done{border-color:color-mix(in srgb,var(--success) 30%,var(--line))}
.onb-card .step.current{border-color:var(--brand);background:var(--brand-soft)}
.onb-card .step-dot{width:26px;height:26px;font-size:12px}
.onb-card .step-txt{min-width:0}
.onb-card .step-label{white-space:normal;overflow-wrap:anywhere;line-height:1.3}

/* Halka kartının listesi (Gelir Dağılımı, Müşteri Sağlığı):
   .dh-deger global kuralda 96px sabit genişlikteydi ve grid sütunu auto
   minimumla büyüyünce satır kartın dışına taşıyordu — yüzde sütunu (%46, %85)
   kartın kenarında kırpılıp okunmaz oluyordu. Ad sütunu artık sıfıra kadar
   kısalabiliyor, tutar kendi genişliği kadar yer kaplıyor. */
.dash-halka .dh-satir{grid-template-columns:9px minmax(0,1fr) auto auto}
.dash-halka .dh-deger{width:auto;min-width:0}
.dash-halka .dh-liste{min-width:150px}

/* Sistem Sağlığı · iş hatası: ekranın tek işi bir işin neden düştüğünü
   söylemek. Metin .cell-sub içinde 200px'e kırpılıyordu. */
.sis-hata{display:block;color:var(--danger);font-size:11.5px;line-height:1.35;white-space:normal;overflow-wrap:anywhere;max-width:520px}

/* .info-row etiketi flex-shrink:0 ile hiç kısalmıyordu. Künye satırlarında
   ("Başlangıç", "Bitiş") sorun değil, ama satırın etiketi uzun bir metin
   olduğunda — lisans kartındaki "Bağlı görevler" listesinde görev başlığı —
   yanındaki rozeti kartın dışına itiyordu: durum rozeti kart kenarında
   kesiliyordu. Etiket artık yer yetmediğinde kısalıyor; kısa etiketler zaten
   içerikleri kadar yer kapladığı için etkilenmiyor. */
.info-row .lbl{min-width:0;flex-shrink:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.info-row .val{flex-shrink:0}

/* Onay penceresinin metni: data-confirm çok satırlı yazılabiliyor, satır
   sonları korunmalı. */
.onay-metin{white-space:pre-line}

/* Kontör · elle tüketim kutusu. Asıl kaynak entegratör senkronu; bu form
   dönem toplamı ve devir için. Katlanır durması, ekranın ana işini (hak ve
   tüketim görüntüleme) öne çıkarıyor. */
.kontor-elle > summary{cursor:pointer;font-size:13px;font-weight:650;color:var(--brand);list-style:none}
.kontor-elle > summary::-webkit-details-marker{display:none}
.kontor-elle > summary::before{content:"+ ";font-weight:700}
.kontor-elle[open] > summary::before{content:"− "}

/* Ortak Paneli › Raporlar (0181 sonrası, Faz 3e). Ekran süzgeci kâğıda
   basılmaz; sayfa başlığı baskıda gizli olduğu için rapor kendi başlığını
   yalnız kâğıtta gösterir. */
.or-donem{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.or-donem .input{height:30px;font-size:12.5px;width:auto;padding:0 8px}
.or-iki{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px}
.or-iki > .card{min-width:0}
/* .data-table 1080px taban genişliği yarım kartta sütunları kaydırıp gizliyordu. */
.or-iki .data-table{min-width:0}
@media (max-width:900px){.or-iki{grid-template-columns:1fr}}
.or-tablo th.num,.or-tablo td.num{text-align:right}
.or-iptal td{color:var(--muted)}
.or-iptal td b{text-decoration:line-through;font-weight:500}
.or-baski{display:none}
@media print{
  .or-ekran{display:none!important}
  .or-baski{display:block;margin-bottom:14px;padding-bottom:10px;border-bottom:2px solid #111}
  /* Ekranda display:none olduğu için giriş animasyonu (icerik-gir) hiç
     koşmamış olur; baskıya geçince opacity 0'dan başlar ve başlık boş çıkar. */
  .or-baski{animation:none!important}
  .or-tablo{min-width:0!important}
  .or-baski-ust{display:flex;justify-content:space-between;font-size:11px;color:#555}
  .or-baski h1{font-size:20px;margin:6px 0 2px}
  .or-baski p{font-size:12px;margin:0;color:#333}
  .or-bolum{break-inside:avoid;page-break-inside:avoid;box-shadow:none}
  .or-tablo a{color:inherit;text-decoration:none}
  .kpi-grid{grid-template-columns:repeat(4,1fr)!important}
  /* A4 dikey iki tabloyu yan yana taşımıyor: son sütun kesiliyordu. */
  .or-iki{grid-template-columns:1fr;gap:12px}
  .or-bolum .table-scroll{overflow:visible}
  .or-tablo{display:table;width:100%}
  .or-tablo thead{display:table-header-group}
  .or-tablo tbody{display:table-row-group}
  .or-tablo tbody tr{display:table-row;background:none;border:0;box-shadow:none;padding:0;margin:0}
  .or-tablo tbody td{display:table-cell}
  .or-tablo tbody td::before{content:none!important}
}

/* ── Kanal · API anahtarı sekmesi ───────────────────────────────────────── */
/* Anahtar bir kez gösterildiği için satır dikkat çekmeli ve kopyalaması tek
   tıkla olmalı: elle seçip kopyalarken yarısı eksik alınan bir anahtar,
   "çalışmıyor" diye geri dönen bir destek talebine dönüşür. */
.ka-anahtar{display:flex;align-items:center;gap:10px;background:var(--brand-soft);
  border:1px solid var(--brand);border-radius:8px;padding:10px 12px}
.ka-anahtar code{flex:1;min-width:0;font-family:var(--mono);font-size:13px;
  color:var(--brand);word-break:break-all;user-select:all}
.ka-dugmeler{display:flex;gap:8px;margin-top:14px}
.ka-kod{background:var(--ink);color:#DDE9F5;border-radius:8px;padding:11px 13px;margin:0;
  font-family:var(--mono);font-size:12px;line-height:1.6;overflow-x:auto;white-space:pre-wrap;
  word-break:break-word}

/* Bayi gözüyle bak (0189): üst bant ve kapalı işlem düğmeleri. */
.gozlem-bant{position:sticky;top:0;z-index:60;display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  padding:9px 24px;background:var(--warning-soft,#fff4e0);color:var(--ink);border-bottom:1px solid var(--warning,#d97706);
  font-size:13px}
.gozlem-bant svg{width:18px;height:18px;fill:none;stroke:var(--warning,#d97706);stroke-width:1.6;flex-shrink:0}
.gozlem-bant .btn{background:var(--card);border:1px solid var(--warning,#d97706);color:var(--ink)}
body[data-gozlem] form[method=post]:not([data-gozlem-cik]) [type=submit],
body[data-gozlem] form[method=post]:not([data-gozlem-cik]) button:not([type=button]){opacity:.5;cursor:not-allowed}

/* Ortak özeti · Yapılacaklar: satırlar uzun metin taşır (sipariş notu, müşteri
   adı); telefonda sağdaki değer alta iner, sayfayı yana taşırmaz. */
.yapilacaklar .info-row .val{min-width:0;overflow-wrap:anywhere}
@media (max-width:640px){
  .yapilacaklar .info-row{flex-wrap:wrap}
  .yapilacaklar .info-row .val{text-align:left;max-width:100%;flex:1 1 100%}
}

/* Teklif onay şeridi (teklif_detay): kararı vermek için gereken bilgi ve iki
   düğme tek satırda. Kart yüksekliğinde bir blok, ekranın üçte birini yiyip
   asıl içeriği aşağı itiyordu. */
.onay-serit{display:flex;align-items:center;gap:14px;margin-bottom:16px;padding:12px 16px;
  border:1px solid var(--warning);border-left-width:3px;border-radius:10px;background:var(--warning-soft)}
.onay-serit-ikon{display:flex;flex:0 0 auto;color:var(--warning)}
.onay-serit-ikon svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.onay-serit-metin{flex:1 1 auto;min-width:0;display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px}
.onay-serit-metin>b{font-size:13.5px;font-weight:650;color:var(--ink)}
.onay-serit-olcu{display:inline-flex;align-items:baseline;gap:8px;font-size:12.5px;font-weight:600;color:var(--ink)}
.onay-serit-olcu i{font-style:normal;font-weight:500;color:var(--muted)}
.onay-serit-olcu em{font-style:normal;font-weight:650;color:var(--danger);background:var(--danger-soft);
  border-radius:999px;padding:1px 8px;font-size:11.5px}
.onay-serit-alt{flex:1 1 100%;font-size:11.5px;color:var(--muted);line-height:1.5}
.onay-serit-eylem{display:flex;flex:0 0 auto;gap:8px}
.onay-serit-not{flex:0 1 260px;font-size:11.5px;color:var(--muted);line-height:1.45}
@media (max-width:720px){
  .onay-serit{flex-wrap:wrap}
  .onay-serit-eylem{width:100%}
  .onay-serit-eylem form,.onay-serit-eylem .btn{flex:1 1 0;width:100%;justify-content:center}
}

/* ════════════════════════════════════════════════════════════════════════
   RAPOR MODÜLÜ · GÖRSEL DİL
   ────────────────────────────────────────────────────────────────────────
   Bilgi mimarisi, rapor adları ve işlevler DEĞİŞMEDİ; değişen yalnız sunum.
   Amaç: 34 rapor ekranının tek bir analitik üründen çıkmış gibi durması.
   Kurallar (bütün rapor ekranlarında aynı):
     · Köşe yarıçapı 14px, 1px kenarlık, çok hafif gölge — kart "kutu" değil,
       aynı yüzeyin bölümü gibi dursun.
     · Sayılar tabular-nums; para ve oran sağa hizalı.
     · Renk anlam taşır: yeşil pozitif, kırmızı negatif, amber uyarı, marka
       rengi yalnız vurgu. Dekoratif renk yok.
     · Vurgu sırası: başlık → süzgeç → KPI → ana grafik → ikincil analiz →
       detay tablo → yöntem notu.
   ════════════════════════════════════════════════════════════════════════ */

/* ---- Başlık bölgesi ---- */
.rs-ust{align-items:flex-start}
.rs-kimlik h1{letter-spacing:-.025em}
.rs-kimlik p{max-width:76ch}
.rs-aksiyon{gap:8px}

/* ---- Araç şeridi: süzgeçler tek bir yüzeyde toplanır ----
   Eskiden dönem çipleri, süzgeç kutuları ve aralık etiketi sayfanın en üstünde
   üç ayrı katman gibi duruyordu ve ekranın görsel olarak EN AĞIR alanıydı.
   Şimdi tek bir hafif yüzeyde toplanıyor; çipler ikincil ağırlıkta. */
.rs-arac{background:var(--card);border:1px solid var(--line);border-radius:14px;
  padding:12px 14px;gap:10px;box-shadow:0 1px 2px rgba(15,49,86,.03)}
.rs-arac-bos{background:transparent;border:0;box-shadow:none;padding:0 2px}
.rs-donem{gap:4px}
.rs-chip{font-size:12px;font-weight:550;color:var(--muted);background:transparent;
  border:1px solid transparent;border-radius:8px;padding:5px 10px;transition:
  background .12s,color .12s,border-color .12s}
.rs-chip:hover{background:var(--bg);color:var(--ink)}
.rs-chip.is-on{background:var(--brand-soft);color:var(--brand);
  border-color:color-mix(in srgb,var(--brand) 22%,transparent);font-weight:650}
.rs-aralik{font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}

/* ---- Bölüm başlıkları ----
   Kartlar arasına ince bir ritim koyar: okuyucu "özet mi, analiz mi, detay mı"
   sorusunu kaydırmadan bilir. Dekoratif değil, gezinme işaretidir. */
.rs-bolum{display:flex;align-items:center;gap:10px;margin:22px 2px 10px}
.rs-bolum h2{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  color:var(--muted);margin:0;white-space:nowrap}
.rs-bolum i{flex:1;height:1px;background:var(--line);display:block}
.rs-bolum span{font-size:12px;color:var(--muted)}

/* ---- Yönetici özeti ---- */
.rs-ozet-serit{border-radius:14px;padding:15px 18px;
  background:linear-gradient(90deg,color-mix(in srgb,var(--brand) 5%,var(--card)),var(--card) 55%)}

/* ---- KPI kartları ----
   İlk kart raporun MANŞET metriğidir (bütün raporlarda ilk sıraya o konuyor);
   hafifçe öne çıkar. Kalanlar eşit ağırlıkta kalır ki kart enflasyonu
   hiyerarşiyi bozmasın. */
.rs-kpi{gap:14px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.rs-kpi-kart{border-radius:14px;padding:16px 18px 14px;gap:4px;
  box-shadow:0 1px 2px rgba(15,49,86,.03)}
.rs-kpi-kart:hover{box-shadow:0 6px 18px rgba(15,49,86,.08)}
.rsk-et{font-size:11.5px;letter-spacing:.01em;color:var(--muted)}
.rsk-deger{font-size:26px;letter-spacing:-.03em}
.rs-kpi .rs-kpi-kart:first-child .rsk-deger{font-size:30px}
/* Değişim artık düz metin değil, okunması kolay bir rozet. */
.rsk-degisim{gap:6px;margin-top:4px}
.rsk-degisim b{display:inline-flex;align-items:center;gap:4px;padding:2px 7px;
  border-radius:999px;font-size:11.5px;font-weight:650}
.rsk-degisim.d-iyi b{background:var(--success-soft);color:var(--success)}
.rsk-degisim.d-kotu b{background:var(--danger-soft);color:var(--danger)}
.rsk-degisim svg{width:12px;height:12px}
.rsk-alt,.rsk-degisim span{font-size:11.5px;color:var(--muted)}
.rsk-kivilcim{margin-top:10px}

/* ---- Kart dili: grafik, kırılım ve tablo kartları aynı ---- */
.rs-grafik,.rs-iki .card,.rs-tablo-kart{border-radius:14px;
  box-shadow:0 1px 2px rgba(15,49,86,.03)}
.rs-grafik .card-head,.rs-iki .card-head,.rs-tablo-kart .card-head{padding-bottom:10px}
.rs-grafik .card-title,.rs-iki .card-title,.rs-tablo-kart .card-title{font-size:14px;
  font-weight:650;letter-spacing:-.01em}
.rg-yorum{border-top:1px solid var(--line);padding-top:10px;margin-top:12px}

/* ---- Grafik yüzeyi ---- */
.rg-kilavuz{stroke:color-mix(in srgb,var(--line) 75%,transparent)}
/* Sıfır çizgisi artı/eksi grafiğin eksenidir; kılavuzdan koyu olmalı. */
.rg-sifir{stroke:color-mix(in srgb,var(--ink) 30%,transparent);stroke-width:1.2}
.rg-eksen{font-size:10.5px}
/* Çizgi soldan sağa çizilir, sütunlar tabandan büyür: grafiğin okunma yönünü
   gösteren kısa bir hareket. Hareketi azalt tercihinde kapanır. */
@keyframes rg-ciz{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes rg-yayil{from{opacity:0}to{opacity:1}}
.rg-cizgi{stroke-dasharray:1;animation:rg-ciz .75s ease-out forwards}
.rg-cizgi.rg-kesik{stroke-dasharray:5 4;animation:none}
.rg-svg path[fill^="url"]{animation:rg-yayil .6s ease-out .2s both}
.rg-nokta,.rg-son-deger,.rg-sutun-deger{animation:rg-yayil .4s ease-out .55s both}
.rg-sutun{transform-box:fill-box;transform-origin:bottom;animation:rg-buyu .5s ease-out both}
@keyframes rg-buyu{from{transform:scaleY(0)}to{transform:scaleY(1)}}
.rg-huni-dilim{animation:rg-yayil .45s ease-out both}
.rg-isi-goz{animation:rg-yayil .35s ease-out both}
@media (prefers-reduced-motion:reduce){
  .rg-cizgi,.rg-svg path[fill^="url"],.rg-nokta,.rg-son-deger,.rg-sutun-deger,
  .rg-sutun,.rg-huni-dilim,.rg-isi-goz{animation:none}
  .rg-cizgi{stroke-dasharray:none}
  .rg-cizgi.rg-kesik{stroke-dasharray:5 4}
}

/* ---- Tablo: finans tablosu gibi okunsun ----
   Kolon ayıran dikey çizgiler kaldırıldı, satır ayrımı tek bir ince çizgi;
   sayılar tabular, negatifler kırmızı, toplam satırı kalın ve üstten çizgili. */
.rs-tablo{font-variant-numeric:tabular-nums}
.rs-tablo thead th{font-size:10.5px;font-weight:700;letter-spacing:.07em;
  text-transform:uppercase;color:var(--muted);padding-top:10px;padding-bottom:10px}
.rs-tablo tbody td{border-bottom:1px solid color-mix(in srgb,var(--line) 70%,transparent)}
.rs-tablo tbody tr:nth-child(even){background:transparent}
.rs-tablo tbody tr:hover{background:color-mix(in srgb,var(--brand) 4%,transparent)}
.rs-tablo tbody td:first-child{font-weight:600;color:var(--ink)}
.rs-tablo td.td-sag,.rs-tablo th.td-sag{text-align:right}
.rs-tablo .v-kotu{color:var(--danger);font-weight:600}
.rs-tablo .v-iyi{color:var(--success);font-weight:600}
.rs-tablo .v-uyari{color:var(--warning);font-weight:600}
.rs-tablo tfoot td{font-weight:700;color:var(--ink);
  border-top:1.5px solid color-mix(in srgb,var(--ink) 18%,transparent);
  background:color-mix(in srgb,var(--bg) 60%,transparent)}

/* ---- Bar kırılımları ---- */
.rs-bar-cizgi{height:7px}
.rs-bar-ad{font-weight:600}
.rs-bar-deger{font-variant-numeric:tabular-nums;font-weight:650}
.rs-bar-alt{font-size:11.5px;color:var(--muted)}

/* ---- Bulgular ---- */
.rs-bulgu{border-radius:12px;box-shadow:0 1px 2px rgba(15,49,86,.03)}

@media (max-width:900px){
  .rs-kpi{grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}
  .rs-kpi .rs-kpi-kart:first-child .rsk-deger{font-size:26px}
  .rg-svg{aspect-ratio:720/300}
}

/* ---- Halka kartı: grafik ve açıklama yan yana ----
   .rg-tuval-yan şablonda yıllardır yazılıyordu ama CSS'te KARŞILIĞI YOKTU;
   halka kartın soluna sıkışıp sağında koca bir boşluk kalıyordu. Legend
   grafiğin yanına alınınca kart hem dengeli hem okunur oluyor. */
.rg-tuval-yan{display:flex;align-items:center;gap:26px;flex-wrap:wrap}
/* Halka, tam genişlikteki kartta 200px'te küçük kalıyordu; kartın kendi
   genişliğine göre büyüyor (container query), ama hiçbir zaman ölçeğini
   bozacak kadar değil. */
.rg-tuval-yan .rg-halka{flex:0 0 200px}
@container (min-width:720px){
  .rg-tuval-yan .rg-halka{flex:0 0 250px;width:250px;height:250px}
}
@container (min-width:960px){
  .rg-tuval-yan .rg-halka{flex:0 0 280px;width:280px;height:280px}
}
.rg-tuval-yan .rs-halka-legend{flex:1 1 220px;min-width:200px}
/* Legend listesi ekran genişledikçe sonsuza uzamasın. */
.rg-tuval-yan .rs-halka-legend{max-width:560px}
/* Grafik kartı tek başına kaldığında satırı kaplayıp seyrelmesin. */
.rs-grafikler > .card.rs-grafik:not(.rs-genis):only-child{max-width:640px}

/* ---- Rapor merkezi kartları: ekranla aynı dil ----
   Katalog ile rapor ekranı iki ayrı üründen çıkmış gibi duruyordu; yarıçap,
   gölge ve hover davranışı eşitlendi. */
.rp-kart{border-radius:14px;box-shadow:0 1px 2px rgba(15,49,86,.03);
  transition:border-color .15s,box-shadow .15s,transform .15s}
.rp-kart:hover{transform:translateY(-1px);box-shadow:0 8px 22px rgba(15,49,86,.09)}
.rp-kart h3{letter-spacing:-.015em}
.rpk-soru{border-radius:10px}

/* ---- Boş durumlar ----
   "Veri yok" ile "süzgece uyan kayıt yok" aynı görünüyordu; ikisi de aynı
   sakin yüzeyde ama okunur bir metinle duruyor. Sahte iskelet/yükleniyor
   animasyonu YOK: ekran sunucuda hazır geliyor, olmayan bir bekleyişi
   canlandırmak yanlış bilgi olurdu. */
.rs-grafik .empty,.rs-iki .empty,.rs-tablo-kart .empty{padding:26px 18px;
  background:color-mix(in srgb,var(--bg) 60%,transparent);border-radius:12px;
  border:1px dashed var(--line)}
.rs-grafik .empty p,.rs-iki .empty p,.rs-tablo-kart .empty p{color:var(--muted);
  font-size:13px;max-width:52ch}

/* ---- Dar ekran ----
   Grafikler küçülünce eksen etiketleri üst üste binmesin; kart iç boşluğu
   daralsın ama tipografi küçülmesin. */
@media (max-width:720px){
  .rs-arac{padding:10px}
  .rs-donem{overflow-x:auto;flex-wrap:nowrap;padding-bottom:2px}
  .rs-chip{white-space:nowrap}
  .rg-svg{aspect-ratio:720/320}
  .rg-tuval-yan{gap:14px}
  .rs-bolum{margin:18px 2px 8px}
  .rs-kpi{gap:10px}
  .rs-kpi-kart{padding:13px 14px 11px}
  .rs-kpi .rs-kpi-kart:first-child .rsk-deger{font-size:24px}
  .rsk-deger{font-size:22px}
}

/* ---- Grafik ölçeklemesi: yazılar esnemesin ----
   SVG'ler preserveAspectRatio="none" ile kabın genişliğine yatay esniyordu;
   eksen yazıları, ay adları ve değer etiketleri de onunla birlikte yayvan
   çıkıyordu. Artık oran korunuyor (meet) ve yükseklik genişlikten türüyor.
   Oran korununca yazı boyu da kabın genişliğiyle ÖLÇEKLENİYOR: geniş kartta
   büyür, dar kartta küçülür. Bunu dengelemek için yazı boyları kap
   genişliğine göre ayarlanıyor — @container, kartın kendi genişliğini
   ölçtüğü için ekran genişliğinden daha doğru sonuç veriyor. */
.rg-tuval{container-type:inline-size}
.rg-svg{width:100%;height:auto;aspect-ratio:720/260;overflow:visible}
.rg-eksen{font-size:9px}
.rg-son-deger{font-size:11px;paint-order:stroke;stroke:var(--card);stroke-width:3px;
  stroke-linejoin:round}
.rg-sutun-deger{font-size:9.5px;paint-order:stroke;stroke:var(--card);stroke-width:3px;
  stroke-linejoin:round}
/* Bu üç grafik doğal boyutunun üstüne büyümüyor (inline max-width), yani
   yazı boyları neredeyse birebir piksel karşılığı. */
.rg-huni-ad{font-size:13.5px}
.rg-huni-deger{font-size:11.5px}
.rg-huni-gecis{font-size:11.5px}
.rg-isi-baslik{font-size:11.5px}
.rg-isi-satir{font-size:12px}
.rg-isi-alt{font-size:10.5px}
.rg-isi-deger{font-size:12.5px}
.rg-hedef-ad{font-size:13px}
.rg-hedef-deger{font-size:13.5px}
.rg-hedef-etiket{font-size:11px}
.rg-isi,.rg-huni,.rg-hedefbar{width:100%}

@container (max-width:900px){
  .rg-eksen{font-size:11px}
  .rg-son-deger{font-size:13px}
  .rg-sutun-deger{font-size:11px}
  .rg-huni-ad{font-size:13px}
  .rg-huni-deger,.rg-huni-gecis{font-size:11.5px}
  .rg-isi-baslik,.rg-isi-satir,.rg-isi-deger{font-size:12px}
  .rg-isi-alt{font-size:10.5px}
  .rg-hedef-ad,.rg-hedef-deger{font-size:13px}
  .rg-hedef-etiket{font-size:11px}
}
@container (max-width:620px){
  /* Dar kartta 12 ay etiketi üst üste biniyordu: her ikincisi gizleniyor,
     ilk ve son etiket (dönemin sınırları) her zaman kalıyor. */
  .rg-x text:nth-child(even){display:none}
  .rg-x text:last-child{display:inline}
  .rg-eksen{font-size:14px}
  .rg-son-deger{font-size:16px}
  .rg-sutun-deger{font-size:13px}
  .rg-huni-ad{font-size:16px}
  .rg-huni-deger,.rg-huni-gecis{font-size:14px}
  .rg-isi-baslik,.rg-isi-satir,.rg-isi-deger{font-size:15px}
  .rg-isi-alt{font-size:13px}
  .rg-hedef-ad,.rg-hedef-deger{font-size:16px}
  .rg-hedef-etiket{font-size:13px}
}
@container (max-width:430px){
  /* Daha da dar: üç etiketten ikisi gizleniyor. */
  .rg-x text:not(:nth-child(3n+1)){display:none}
  .rg-x text:last-child{display:inline}
  .rg-eksen{font-size:18px}
  .rg-son-deger{font-size:20px}
  .rg-sutun-deger{font-size:17px}
  .rg-huni-ad{font-size:20px}
  .rg-huni-deger,.rg-huni-gecis{font-size:18px}
  .rg-isi-baslik,.rg-isi-satir,.rg-isi-deger{font-size:19px}
  .rg-isi-alt{font-size:16px}
  .rg-hedef-ad,.rg-hedef-deger{font-size:20px}
  .rg-hedef-etiket{font-size:17px}
}
/* Çok geniş kartta grafik gereğinden fazla uzamasın. */
@media (min-width:1500px){.rg-svg{max-height:420px}}

/* ---- Rapor merkezi · sadeleştirme ----
   Sorun: 34 kart × 243px = 4000px'lik bir duvar. Kartın yarısını "soru"
   kutusu kaplıyordu, her kartta ayrıca renkli sol şerit + renkli rozet
   vardı; sayfa uzun ve alacalıydı.
   Çözüm: soru kutusu çerçevesiz tek satıra indi, iç boşluk daraldı, renk
   yalnız rozette kaldı (sol şerit çok daha ince ve soluk). Bilgi mimarisi,
   kart içeriği ve sıralama aynı. */
.rp-kart{padding:14px 16px;gap:6px}
.rp-kart{border-left-width:2px;border-left-color:color-mix(in srgb,var(--line) 70%,transparent)}
.rp-kart h3{font-size:14.5px}
.rpk-ozet{font-size:12px;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;
  -webkit-box-orient:vertical;overflow:hidden}
/* Soru artık kutu değil: ince bir ayraç üstünde, italik olmayan sakin bir
   satır. Kutulu hâli her kartta ikinci bir yüzey açıyordu. */
.rpk-soru{background:transparent;padding:6px 0 0;margin-top:2px;
  border-top:1px dashed color-mix(in srgb,var(--line) 80%,transparent);
  font-size:11.5px;color:var(--muted);gap:6px}
.rpk-soru svg{width:13px;height:13px;opacity:.75}
.rpk-git{font-size:12px;padding-top:2px}
.rpk-son{font-size:11px}
/* Izgara: geniş ekranda dört sütun. Üç sütunda 4'lü ve 5'li gruplar tek
   kartlık delikler bırakıyordu; dört sütun hem deliği kapatıyor hem sayfayı
   kısaltıyor. */
@media (min-width:1360px){
  .rp-izgara{grid-template-columns:repeat(4,1fr)}
}

/* ---- Rapor merkezi · dar ekran ----
   Telefonda 34 kart tek sütuna diziliyor ve sayfa 14.000 piksele çıkıyordu.
   Kartta ÖZET gizleniyor, SORU kalıyor: ekranın vaadi "her rapor tek bir
   soruyu cevaplar ve o soru kartın üzerinde yazılıdır" — gizlenecek satır
   özet olmalı. "Son bakış" notu da dar ekranda yer kaplıyor. */
@media (max-width:720px){
  .rp-kart{padding:12px 14px;gap:5px}
  .rp-kart .rpk-ozet{display:none}
  .rp-kart .rpk-son{display:none}
  .rpk-soru{border-top:0;padding-top:2px}
  .rp-grup{margin-bottom:18px}
  .rp-grup-bas{margin-bottom:9px}
}

/* ---- Rapor tablosu · bir tık küçük ----
   Satır yüksekliği ve punto, panelin genel tablo ölçüsünden bir kademe
   aşağıda: rapor tablosu okunacak değil TARANACAK bir listedir, ekrana daha
   çok satır sığması gözün aşağı yukarı gezmesini azaltıyor. Sayılar tabular
   olduğu için küçülme hizayı bozmuyor. */
.rs-tablo td{font-size:12.5px;padding:8.5px 12px 8.5px 0;line-height:1.45}
.rs-tablo th{font-size:10px;padding-bottom:8px}
.rs-tablo tfoot td{padding-top:9px;padding-bottom:9px}
.rs-tablo-kart .table-foot,.rs-tablo-kart .page-info{font-size:11.5px}

/* Rapor tablosu · ikinci kademe küçültme: satır 36px'ten 31px'e, punto
   12,5'ten 12px'e. Tarama listesinde satır yüksekliği okunurluğu değil
   ekrana sığan kayıt sayısını belirliyor. */
.rs-tablo td{font-size:12px;padding:7px 11px 7px 0}
.rs-tablo th{font-size:9.5px;padding-bottom:7px;padding-right:11px}
.rs-tablo tfoot td{padding-top:8px;padding-bottom:8px}

/* Yetki Merkezi: seviye seçimi ve çoklu kutular. Süslü bileşen değil, düz
   radyo/onay kutusu — yetki ekranında ne seçili olduğu tereddütsüz okunmalı. */
.yt-seviye{display:flex;gap:14px;flex-wrap:wrap}
.yt-seviye label{display:inline-flex;align-items:center;gap:6px;font-size:13px;white-space:nowrap;cursor:pointer}
.yt-kutular{display:flex;gap:16px;flex-wrap:wrap;padding:4px 0 2px}
.yt-kutular label{display:inline-flex;align-items:center;gap:6px;font-size:13px;cursor:pointer}
tr.is-selected>td{background:var(--sel-bg,rgba(59,130,246,.07))}

/* ---- API açılış kontrol listesi (Kaynaklar › doküman) ---- */
.ak-ozet{display:flex;align-items:center;gap:18px;margin-bottom:16px;padding:12px 16px;
  background:var(--card);border:1px solid var(--line);border-radius:14px;font-size:13px;
  color:var(--muted);box-shadow:0 1px 2px rgba(15,49,86,.03)}
.ak-ozet b{color:var(--ink);font-variant-numeric:tabular-nums;font-size:15px}
.ak-yazdir{margin-left:auto}
.ak-blok{margin-bottom:14px;border-radius:14px;box-shadow:0 1px 2px rgba(15,49,86,.03)}
.ak-not{margin:0 0 10px;font-size:12.5px;line-height:1.55;color:var(--muted);
  border-left:2px solid var(--line);padding-left:10px}
.ak-tablo td{font-size:12.5px;padding:8px 12px 8px 0;vertical-align:top;line-height:1.5}
.ak-tablo th{font-size:10px}
.ak-tablo td b{color:var(--ink)}
/* Kutu kâğıt içindir: panelde tikleyip kaydeden bir kayıt yok, tıklanabilir
   kutu koymak işaretlenenin saklandığı izlenimi verirdi. */
.ak-kutu{font-size:15px;color:var(--muted);padding-right:6px}
.ak-sorumlu{border-bottom:1px solid var(--line)}
@media print{
  .sidebar,.topbar,.back-link,.ak-yazdir{display:none!important}
  .ak-blok{break-inside:avoid;page-break-inside:avoid;box-shadow:none}
  .ak-tablo td{font-size:11px}
}

/* ---- Kontrol listesi · işaretleme ---- */
.ak-ilerleme{flex:1;max-width:220px;height:7px;border-radius:5px;background:var(--bg);
  border:1px solid var(--line);overflow:hidden}
.ak-ilerleme i{display:block;height:100%;background:var(--success);transition:width .3s}
.ak-sayac{font-size:11.5px;font-weight:650;font-variant-numeric:tabular-nums;color:var(--muted);
  background:var(--bg);border-radius:999px;padding:2px 9px}
.ak-sayac.is-tam{background:var(--success-soft);color:var(--success)}
.ak-form,.ak-notform{margin:0}
.ak-tik{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;
  border-radius:9px;border:1px solid var(--line);background:var(--card);cursor:pointer;
  color:var(--muted);transition:background .12s,border-color .12s,color .12s}
.ak-tik svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:2;
  stroke-linecap:round;stroke-linejoin:round}
.ak-tik:hover{border-color:var(--brand);color:var(--brand)}
.ak-tik.t-tamam{background:var(--success-soft);border-color:transparent;color:var(--success)}
.ak-tik.t-sorunlu{background:var(--danger-soft);border-color:transparent;color:var(--danger)}
/* Tamamlanan satır geri plana çekilir: gözün gitmesi gereken yer kalanlar. */
.ak-satir.d-tamam td:not(.ak-kutu){opacity:.62}
.ak-satir.d-sorunlu{background:color-mix(in srgb,var(--danger) 4%,transparent)}
.ak-kunye{white-space:normal}
.ak-kim{display:block;font-size:11.5px;font-weight:600;color:var(--ink)}
.ak-zaman{display:block;font-size:11px;color:var(--muted);margin-bottom:4px}
.ak-not-input{height:28px;font-size:12px;padding:0 8px}
@media print{
  .ak-tik{border-color:var(--line)}
  .ak-not-input{border:0;padding:0}
  .ak-ilerleme{display:none}
}

/* ---- Entegrasyon rehberi (Kaynaklar › doküman) ----
   Geliştirici belgesi: kod blokları ve alan tabloları öne çıkar, süs yok. */
.ar-ic{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:16px;
  padding:12px 16px;background:var(--card);border:1px solid var(--line);border-radius:14px;
  font-size:13px;box-shadow:0 1px 2px rgba(15,49,86,.03)}
.ar-ic b{color:var(--muted);font-size:11.5px;text-transform:uppercase;letter-spacing:.06em}
.ar-blok{margin-bottom:14px;border-radius:14px;box-shadow:0 1px 2px rgba(15,49,86,.03)}
.ar-tablo td{font-size:12.5px;padding:8px 12px 8px 0;vertical-align:top;line-height:1.55}
.ar-tablo td:first-child{font-weight:600;color:var(--ink);white-space:nowrap}
.ar-tablo th{font-size:10px}
.ar-z{color:var(--danger);font-weight:650}
.ar-uc{padding:14px 0;border-top:1px solid var(--line)}
.ar-uc:first-child{border-top:0;padding-top:4px}
.ar-uc h3{font-size:14px;font-weight:650;margin:0 0 8px;display:flex;align-items:center;gap:8px;
  flex-wrap:wrap}
.ar-metot{font-size:10.5px;font-weight:700;letter-spacing:.05em;padding:2px 7px;border-radius:5px;
  background:var(--brand-soft);color:var(--brand)}
.ar-uc code,.ar-tablo code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;
  background:var(--bg);border:1px solid var(--line);border-radius:5px;padding:1px 5px}
.ar-kod{margin:10px 0;padding:12px 14px;border-radius:10px;overflow-x:auto;
  background:#0F2037;color:#DCE7F5;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:12px;line-height:1.6;white-space:pre}
.ar-not,.ar-yanit,.ar-uyari{font-size:12.5px;line-height:1.6;color:var(--muted);margin:8px 0 0}
.ar-yanit{color:var(--ink)}
.ar-uyari{background:var(--warning-soft);border-left:3px solid var(--warning);
  padding:9px 12px;border-radius:8px;color:var(--ink)}
.ar-adim{margin:0;padding-left:20px;font-size:13px;line-height:1.7}
.ar-adim li{margin-bottom:4px}
.ar-hata .ar-tablo td:first-child{color:var(--danger)}
@media print{.ar-ic{display:none}.ar-blok{break-inside:avoid;box-shadow:none}
  .ar-kod{background:#fff;color:#000;border:1px solid #ccc}}

/* Rehberdeki bağlantı planı: üç küme, sade tablo. Geliştirici "ne yapacağım,
   neden" sorusunu ilk ekranda görsün diye sayfanın başında. */
.ar-kume{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  color:var(--brand);margin:18px 0 6px}
.ar-kume:first-of-type{margin-top:6px}
.ar-plan td{font-size:12.5px;line-height:1.55;vertical-align:top}
.ar-plan td:first-child{font-weight:650;color:var(--ink);white-space:normal;min-width:140px}
.ar-plan td:nth-child(2){color:var(--ink)}
.ar-plan td:nth-child(3),.ar-plan td:nth-child(4){color:var(--muted)}
.ar-plan th{font-size:10px}

/* Duyuru düzenleyici: sosyal medya bloğu. Hesap adresleri Ayarlar'da, blokta
   yalnız hangisinin görüneceği seçiliyor; kutucuklar logolu, çünkü "LinkedIn"
   yazısını okumak yerine ikonu tanımak daha hızlı. */
.dz-sosyal-not{font-size:12px;line-height:1.55;color:var(--muted);background:var(--bg);
  border:1px dashed var(--line);border-radius:9px;padding:9px 11px}
.ay-sosyal-ikon{display:inline-block;vertical-align:-3px;margin-right:6px;border-radius:4px}

/* Ayarlar · ikon takımı seçimi. Seçenek adı değil, takımın kendisi
   gösteriliyor: "sade mi renkli mi" kararı bakarak veriliyor. */
.ay-stil{margin-top:18px}
.ay-stil-liste{display:flex;gap:10px;flex-wrap:wrap}
.ay-stil-kart{flex:1;min-width:230px;display:flex;flex-direction:column;gap:7px;
  border:1px solid var(--line);border-radius:11px;background:var(--card);
  padding:11px 13px;cursor:pointer;transition:border-color .12s,box-shadow .12s}
.ay-stil-kart:hover{border-color:var(--primary)}
.ay-stil-kart.secili{border-color:var(--primary);box-shadow:0 0 0 1px var(--primary) inset}
.ay-stil-ust{display:flex;align-items:center;gap:7px;font-size:13px;color:var(--ink)}
.ay-stil-kart input{margin:0;accent-color:var(--primary)}
.ay-stil-ornek{display:flex;align-items:center;gap:9px;padding:9px 0 3px;
  border-top:1px dashed var(--line)}
.ay-stil-ornek img{display:block}
.ay-stil-not{font-size:11.5px;line-height:1.5;color:var(--muted)}
.dz-sosyal{border:1px solid var(--line);border-radius:10px;background:var(--bg);padding:10px}
.dz-sosyal-liste{display:flex;flex-wrap:wrap;gap:6px}
.dz-sosyal-kutu{display:inline-flex;align-items:center;gap:6px;cursor:pointer;
  border:1px solid var(--line);border-radius:8px;background:var(--card);
  padding:5px 9px 5px 7px;font-size:12px;font-weight:600;color:var(--text);
  transition:border-color .12s,opacity .12s}
.dz-sosyal-kutu img{display:block;border-radius:5px}
.dz-sosyal-kutu input{margin:0;accent-color:var(--primary)}
.dz-sosyal-kutu:hover{border-color:var(--primary)}
/* Seçili kutu çerçevesiyle de belli olsun: soluk/parlak farkı tek başına
   renk körlüğünde zayıf bir işaret. */
.dz-sosyal-kutu:has(input:checked){border-color:var(--primary);box-shadow:0 0 0 1px var(--primary) inset}
/* Seçilmeyen hesap soluk: "işaretli mi" sorusunun yanıtı kutucuğa bakmadan,
   ikonun kendisinden okunuyor. */
.dz-sosyal-kutu.pasif{opacity:.45}
.dz-sosyal-kutu.pasif img{filter:grayscale(1)}
.dz-sosyal-ayar{display:flex;gap:12px;flex-wrap:wrap;margin-top:9px}
.dz-sosyal-ayar label{display:flex;align-items:center;gap:6px;font-size:11.5px;
  font-weight:600;color:var(--muted)}
.dz-sosyal-ayar .input{width:auto;padding:4px 8px;font-size:12px}
.dz-sosyal-onizleme{margin-top:9px;padding-top:9px;border-top:1px dashed var(--line);
  min-height:32px;line-height:1}
.dz-sosyal-onizleme img{display:inline-block;margin:0 4px;vertical-align:middle}
.dz-sosyal-bos{font-size:11.5px;color:var(--muted)}

/* Duyuru görsel bloğu: adres alanı + dosyadan yükleme yan yana. */
.dz-gorsel-kaynak{display:flex;gap:8px;align-items:center}
.dz-gorsel-kaynak .input{flex:1;min-width:0}
.dz-gorsel-kaynak .btn{flex-shrink:0;white-space:nowrap}

/* Duyuru paragrafı: biçimlendirme araç çubuğu ve yazma yüzeyi. */
.dz-arac{display:flex;align-items:center;gap:4px;flex-wrap:wrap;margin-bottom:6px}
.dz-arac button{min-width:28px;height:28px;padding:0 7px;border:1px solid var(--line);
  background:var(--card);border-radius:7px;cursor:pointer;font-size:13px;color:var(--ink);
  display:inline-flex;align-items:center;justify-content:center}
.dz-arac button:hover{border-color:var(--brand);color:var(--brand)}
.dz-arac button svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.8;
  stroke-linecap:round;stroke-linejoin:round}
.dz-arac-ayrac{width:1px;height:18px;background:var(--line);margin:0 3px}
.dz-renkler{display:inline-flex;gap:3px}
.dz-renkler button{width:18px;min-width:18px;height:18px;border-radius:5px;border:1px solid rgba(0,0,0,.12)}
.dz-zengin{min-height:96px;max-height:340px;overflow:auto;padding:10px 12px;line-height:1.6;
  white-space:pre-wrap}
.dz-zengin:empty::before{content:attr(data-ipucu-metin);color:var(--muted)}
.dz-zengin:focus{outline:2px solid var(--brand-soft);border-color:var(--brand)}
.dz-zengin a{color:#1565d8}

/* ---- Mobil bindirme düzeltmeleri (390px tarama, 18 Eyl 2026) ---- */
@media (max-width:767px){
  /* Görünüm seçici (Liste · Pano · Takvim · Hatırlatıcılar) tek satırda
     kalıp sayfayı telefondan geniş yapıyordu: "Hatırlatıcılar" ekranın
     dışında kalıyordu. Sığmazsa alt satıra iner. */
  .gorunum-sec{display:flex;flex-wrap:wrap;flex-shrink:1;max-width:100%}
  .gs-btn{flex:1 1 auto;justify-content:center;padding:0 10px}
  .gs-btn + .gs-btn{border-left:0}
  /* Tahsilat kovasındaki "söz" rozeti kutudan taşıyordu. */
  .ek-soz{white-space:normal;max-width:100%;text-align:center}
  .ek-kovalar{flex-wrap:wrap}
  /* Uzun e-posta/alan adları hücreden taşıyordu (Rehber). */
  td a, td .cell-sub{overflow-wrap:anywhere}
}

/* AI Kredi (0227) — AI, tasarım dilinde mor ile anılır. */
.kpi-icon.k-purple{background:var(--purple-soft)}
.kpi-icon.k-purple svg{stroke:var(--purple)}
.ai-fiyat-izgara{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:16px}
.ai-fiyat-izgara > *{min-width:0}
.satir-acilir > summary{list-style:none;cursor:pointer}
.satir-acilir > summary::-webkit-details-marker{display:none}
.satir-acilir[open] .satir-acilir-govde{display:flex}
.satir-acilir-govde{display:none;gap:8px;align-items:center;margin-top:8px}
.satir-acilir-govde .input{min-width:0;width:220px}
@media (max-width:767px){
  .ai-fiyat-izgara{grid-template-columns:1fr}
  .satir-acilir-govde{flex-direction:column;align-items:stretch}
  .satir-acilir-govde .input{width:100%}
}