/* =========================================================
   Yönetim Paneli — panel.css (style.css üzerine ek katman)
   ========================================================= */

body.panel-body{ background:var(--bg); min-height:100vh }

/* ---- Yerleşim ----
   Kenar çubuğu sayfa uzadıkça uzamaz: ekran yüksekliğinde sabit durur, sayfa
   kaydırılırken yerinde kalır. Menü ekrana sığmazsa marka ve kullanıcı
   şeritleri sabit kalır, yalnızca ortadaki bağlantı listesi kayar. */
.panel-wrap{ display:flex; min-height:100vh }
.panel-side{
  width:250px; flex:0 0 250px;
  background:var(--navy); color:#c6d3dc;
  display:flex; flex-direction:column;
  position:sticky; top:0; height:100vh; align-self:flex-start;
}
.panel-main{ flex:1; min-width:0; display:flex; flex-direction:column }
.panel-content{ padding:26px; flex:1 }

/* ---- Kenar çubuğu ---- */
.pside-brand{
  display:flex; align-items:center; gap:12px; flex:none;
  padding:18px 18px 16px; border-bottom:1px solid rgba(255,255,255,.08);
}
.pside-brand img{ width:40px; height:40px; background:#fff; border-radius:50%; padding:2px }
.pside-brand b{ display:block; font-size:13.5px; color:#fff; line-height:1.3 }
.pside-brand small{ font-size:11px; color:#8ea0ad }

.pside-nav{
  padding:14px 10px; flex:1;
  overflow-y:auto; overscroll-behavior:contain;
  /* Kaydırma çubuğu koyu zeminde göze batmasın */
  scrollbar-width:thin; scrollbar-color:rgba(255,255,255,.22) transparent;
}
.pside-nav::-webkit-scrollbar{ width:7px }
.pside-nav::-webkit-scrollbar-track{ background:transparent }
.pside-nav::-webkit-scrollbar-thumb{
  background:rgba(255,255,255,.18); border-radius:100px;
}
.pside-nav::-webkit-scrollbar-thumb:hover{ background:rgba(255,255,255,.32) }
.pside-nav .nav-label{
  font-size:10.5px; font-weight:700; letter-spacing:.8px; text-transform:uppercase;
  color:#6d8091; padding:12px 10px 6px;
}
.pside-nav a{
  display:flex; align-items:center; gap:11px;
  padding:9px 12px; border-radius:9px; margin-bottom:2px;
  color:#c6d3dc; font-size:13.5px; font-weight:500; text-decoration:none;
  transition:.15s;
}
.pside-nav a i{ width:18px; text-align:center; font-size:14px; color:#7f93a3 }
.pside-nav a:hover{ background:rgba(255,255,255,.07); color:#fff }
.pside-nav a.active{ background:var(--green); color:#fff }
.pside-nav a.active i{ color:#fff }

.pside-user{
  padding:14px 18px; border-top:1px solid rgba(255,255,255,.08);
  display:flex; align-items:center; gap:10px; flex:none;
}
.pside-user .avatar{
  width:34px; height:34px; border-radius:50%; flex:0 0 34px;
  background:var(--green); color:#fff; font-weight:700; font-size:13px;
  display:flex; align-items:center; justify-content:center;
}
.pside-user b{ display:block; font-size:12.5px; color:#fff; line-height:1.25 }
.pside-user small{ font-size:11px; color:#8ea0ad }
.pside-user form{ margin-left:auto }
.pside-user button{
  background:none; border:none; color:#8ea0ad; font-size:14px; padding:6px;
}
.pside-user button:hover{ color:#ff8f87 }

/* ---- Üst çubuk ---- */
.panel-top{
  background:#fff; border-bottom:1px solid var(--line);
  padding:14px 26px; display:flex; align-items:center; gap:14px;
}
.panel-top h1{ font-size:17px; font-weight:700; color:var(--ink); margin:0 }
.panel-top .crumb{ font-size:12px; color:var(--muted) }
.panel-top .top-actions{ margin-left:auto; display:flex; gap:8px }

/* ---- Kartlar / istatistik ---- */
.stat-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(190px,1fr)); gap:14px; margin-bottom:24px }
.stat-card{
  background:#fff; border:1px solid var(--line); border-radius:14px;
  padding:16px 18px; display:flex; align-items:center; gap:14px;
}
.stat-card .ico{
  width:42px; height:42px; border-radius:12px; flex:0 0 42px;
  display:flex; align-items:center; justify-content:center; font-size:16px;
  background:var(--green-100); color:var(--green);
}
.stat-card.warn .ico{ background:var(--accent-100); color:var(--accent) }
.stat-card.info .ico{ background:var(--navy-100); color:var(--navy) }
.stat-card b{ display:block; font-size:22px; color:var(--ink); line-height:1.1 }
.stat-card small{ display:block; font-size:12px; font-weight:600; color:var(--ink) }

/* ---- Gösterge paneli: bölüm başlıkları ---- */
.board-head{ display:flex; align-items:baseline; gap:12px; margin:0 0 12px; flex-wrap:wrap }
.board-head h2{
  font-size:15px; font-weight:700; color:var(--ink); margin:0;
  display:flex; align-items:center; gap:8px;
}
.board-head h2 i{ color:var(--green); font-size:14px }
.board-head span{ font-size:12px; color:var(--muted) }

/* ---- Bekleyen iş kartları (tıklanabilir) ---- */
.step-card{ text-decoration:none; transition:border-color .15s, box-shadow .15s, transform .15s }
.step-card:hover{ border-color:var(--green); box-shadow:0 4px 14px rgba(55,92,79,.10); transform:translateY(-1px) }
.step-card em{ display:block; font-style:normal; font-size:11px; color:var(--muted); margin-top:2px; line-height:1.35 }
.step-card.is-empty{ opacity:.55 }
.step-card.is-empty b{ color:var(--muted) }

/* ---- Genel durum özeti ---- */
.ozet-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:28px }
.ozet-baslik{
  display:flex; align-items:center; gap:7px;
  font-size:11px; font-weight:700; letter-spacing:.6px;
  text-transform:uppercase; color:var(--muted); margin-bottom:8px;
}
.ozet-baslik i{ color:var(--green); font-size:12px }

/* İki sütunun neyi saydığını açıklayan not */
.ozet-not{
  display:flex; gap:10px; align-items:flex-start;
  margin-top:22px; padding:12px 14px;
  background:#f7faf9; border:1px solid var(--line); border-radius:10px;
  font-size:12.5px; color:var(--muted); line-height:1.6;
}
.ozet-not i{ color:var(--green); margin-top:2px }
.ozet-not b{ color:var(--body) }
.ozet-satir b{ font-size:30px; font-weight:700; color:var(--ink); line-height:1 }
.ozet-satir small{ display:block; font-size:12px; color:var(--muted); margin-top:3px }
.ozet-alt{ list-style:none; padding:0; margin:14px 0 0; border-top:1px solid var(--line); padding-top:12px }
.ozet-alt li{
  display:flex; align-items:center; gap:9px;
  font-size:13px; color:var(--body); padding:5px 0;
}
.ozet-alt li i{ width:15px; text-align:center; color:var(--green); font-size:12px; opacity:.8 }
.ozet-alt li b{ margin-left:auto; font-size:14px; color:var(--ink); font-variant-numeric:tabular-nums }

.pcard{
  background:#fff; border:1px solid var(--line); border-radius:14px;
  margin-bottom:20px; overflow:hidden;
}
.pcard-head{
  padding:14px 20px; border-bottom:1px solid var(--line);
  display:flex; align-items:center; gap:10px; background:#fbfdfc;
}
.pcard-head i{ color:var(--green) }
.pcard-head b{ font-size:14px; color:var(--ink) }
.pcard-head .ms-auto{ margin-left:auto }
.pcard-body{ padding:20px }

/* ---- Ruhsat künyesi ----
   Numara uzaktan okunacak kadar büyük; durum rengi ve simgesi kartın üst
   şeridini boyar, böylece listeden açılan kaydın aktif mi iptal mi olduğu
   metni okumadan anlaşılır. */
.ruhsat-kunye{
  padding:18px 20px 16px; text-align:center;
  border-bottom:1px solid var(--line);
}
.ruhsat-no{
  font-size:40px; line-height:1.05; font-weight:800; letter-spacing:1px;
  color:var(--navy); word-break:break-word;
}
.ruhsat-durum{
  display:inline-flex; align-items:center; gap:6px; margin-top:10px;
  padding:5px 14px; border-radius:100px;
  font-size:12.5px; font-weight:700; letter-spacing:.3px;
}
.ruhsat-durum i{ font-size:12px }
.ruhsat-alt{ margin-top:9px; font-size:12px; color:var(--muted) }

/* ---- Gösterge panelindeki ruhsat araması ----
   Kendi zeminine oturan bağımsız bir blok: üstündeki "Bekleyen İşler"
   kartlarıyla ve altındaki "Genel Durum" tablosuyla karışmaması için
   belirgin bir zemin, çerçeve ve geniş boşluk verilir. */
.ara-kutu{
  margin:26px 0 30px; padding:18px 20px 16px;
  background:linear-gradient(180deg, #f2f7f4 0%, #eaf2ee 100%);
  border:1px solid #d8e6de; border-radius:16px;
}
.ara-basi{
  display:flex; align-items:center; gap:11px; margin-bottom:12px;
  color:var(--navy);
}
.ara-basi > i{
  flex:none; width:34px; height:34px; border-radius:10px;
  display:flex; align-items:center; justify-content:center;
  background:var(--green, #2f7a4d); color:#fff; font-size:14px;
}
.ara-basi b{ display:block; font-size:14.5px; line-height:1.25 }
.ara-basi small{ display:block; font-size:12px; color:var(--muted); margin-top:1px }

.ara-satir{
  display:flex; align-items:center; gap:10px;
  background:#fff; border:1px solid #cfe0d6; border-radius:12px;
  padding:6px 6px 6px 16px;
  transition:border-color .15s, box-shadow .15s;
}
.ara-satir:focus-within{
  border-color:var(--green, #2f7a4d);
  box-shadow:0 0 0 3px rgba(47,122,77,.14);
}
.ara-simge{ flex:none; color:var(--muted); font-size:15px }
.ara-satir input{
  flex:1; min-width:0; border:0; outline:0; background:transparent;
  font-size:14.5px; color:var(--body); padding:10px 0;
}
.ara-satir input::placeholder{ color:#9aa8a2 }
.ara-satir .btn{ flex:none; padding:10px 26px; border-radius:9px }

.ara-ipuclari{
  display:flex; flex-wrap:wrap; gap:8px; margin-top:12px;
}
.ara-ipuclari span{
  font-size:11.5px; color:var(--muted);
  background:rgba(255,255,255,.75); border:1px solid #dbe7e1;
  border-radius:100px; padding:4px 11px;
}
.ara-ipuclari b{ color:var(--navy); font-weight:700 }

/* ---- Devir zinciri ----
   Halkalar zaman sırasıyla alt alta: önceki üstte, bu ruhsat ortada, sonraki
   altta. Yön etiketi ve ok, tıklanacak kaydın bu ruhsattan önce mi sonra mı
   geldiğini tek bakışta söyler. */
.zincir{ padding:14px 20px; border-bottom:1px solid var(--line) }
.zincir-baslik{
  font-size:11px; text-transform:uppercase; letter-spacing:.5px;
  color:var(--muted); font-weight:700; margin-bottom:8px;
}
.zincir-halka{
  display:flex; align-items:center; gap:10px; padding:9px 12px; margin-bottom:6px;
  border:1px solid var(--line); border-radius:10px; background:#fff;
  color:var(--body); text-decoration:none;
}
a.zincir-halka:hover{ border-color:var(--green, #2f7a4d); background:#f7fbf9 }
.zincir-halka.pasif{ opacity:.6 }
.zincir-halka.bu{ background:var(--navy-100); border-color:#cfd9e2 }
.zincir-yon{
  flex:none; font-size:9.5px; font-weight:800; letter-spacing:.5px;
  padding:3px 8px; border-radius:100px; white-space:nowrap;
}
.zincir-yon.onceki{ background:#eceff1; color:#5b6a72 }
.zincir-yon.sonraki{ background:var(--accent-100, #fdf3d8); color:#8a5a1c }
.zincir-yon.bu{ background:var(--navy, #123c5a); color:#fff }
.zincir-no{ flex:none; font-size:15px; font-weight:800; color:var(--navy) }
.zincir-bilgi{ flex:1; min-width:0; font-size:11.5px; color:var(--muted); line-height:1.45 }
.zincir-bilgi small{ font-size:10.5px }
.zincir-ok{ flex:none; font-size:11px; color:var(--muted) }

/* ---- Tablolar ---- */
.ptable{ width:100%; font-size:13.5px; margin:0 }
.ptable th{
  font-size:11px; text-transform:uppercase; letter-spacing:.5px;
  color:var(--muted); font-weight:700; padding:10px 14px;
  border-bottom:1px solid var(--line); background:#fbfdfc; text-align:left;
}
/* Sıralanabilir başlık: metnin yanında sönük çift ok; etkin olan koyulaşır
   ve yalnızca geçerli yönün oku görünür. Başlığın boyu değişmez. */
.ptable th.sortable{ padding:0 }
.ptable th.sortable a{
  display:flex; align-items:center; gap:5px; padding:10px 14px;
  color:inherit; text-decoration:none; white-space:nowrap;
}
.ptable th.sortable a:hover{ color:var(--navy); background:#f3f7f5 }
.ptable th.sortable .ok{
  display:inline-flex; flex-direction:column; line-height:.55; font-size:8px;
  color:#c3ceca; flex:none;
}
.ptable th.sortable a:hover .ok{ color:var(--muted) }
.ptable th.is-sorted{ color:var(--navy); background:#eef4f1 }
.ptable th.is-sorted .ok{ color:var(--green, #2f7a4d) }
.ptable th.is-sorted .ok i{ opacity:.25 }
.ptable th.is-sorted .ok i.etkin{ opacity:1 }

.ptable td{ padding:11px 14px; border-bottom:1px solid #eef2f3; color:var(--body); vertical-align:middle }
.ptable tr:last-child td{ border-bottom:none }
.ptable tr:hover td{ background:#fafcfb }

.badge-role{
  font-size:11px; font-weight:700; padding:3px 10px; border-radius:100px;
  background:var(--navy-100); color:var(--navy);
}
.badge-role.super-admin{ background:#f6e3f1; color:#8d3a77 }
.badge-role.kodlama{ background:var(--green-100); color:var(--green-700) }
.badge-role.ctv{ background:var(--accent-100); color:#8a5a1c }
.badge-on{ color:var(--ok); font-weight:600; font-size:12.5px }
.badge-off{ color:var(--err); font-weight:600; font-size:12.5px }

/* ---- Formlar ---- */
.panel-content .form-label{ font-size:12.5px }
.panel-content .form-control, .panel-content .form-select{ font-size:14px }
.flash-ok, .flash-err{
  border-radius:11px; padding:12px 16px; margin-bottom:18px;
  font-size:13.5px; font-weight:500; display:flex; align-items:center; gap:10px;
}
.flash-ok{ background:#f0faf5; border:1px solid #bfe6d3; color:#1f7a54 }
.flash-err{ background:#fdf3f2; border:1px solid #f5d5d2; color:#a3352d }

/* ---- SMS değişken tablosu ---- */
.var-table code{
  background:var(--green-050); border:1px solid #d8e5e0; color:var(--green-700);
  padding:2px 8px; border-radius:6px; font-size:12.5px; cursor:pointer;
}
.var-table code:hover{ background:var(--green-100) }
.var-table td{ font-size:12.5px }

/* ---- Giriş sayfası ---- */
.login-page{
  min-height:100vh; display:flex; align-items:center; justify-content:center;
  background:linear-gradient(118deg,var(--green) 0%,#34544c 45%,var(--navy) 100%);
  padding:20px;
}
.login-card{
  background:#fff; border-radius:20px; box-shadow:var(--shadow-lg);
  width:100%; max-width:420px; overflow:hidden;
}
.login-head{ text-align:center; padding:30px 30px 6px }
.login-head img{ width:74px; height:74px; margin-bottom:12px }
.login-head b{ display:block; font-size:16px; color:var(--green); letter-spacing:.5px }
.login-head small{ color:var(--muted); font-size:12.5px }
.login-body{ padding:22px 30px 30px }

@media (max-width: 991.98px){
  .panel-side{ width:64px; flex-basis:64px }
  .pside-brand b, .pside-brand small, .pside-nav a span, .nav-label, .pside-user b, .pside-user small{ display:none }
  .pside-nav a{ justify-content:center }
  .pside-user{ justify-content:center }
  .pside-user form{ margin:0 }
}

/* Salt okunur kuyruk bağlantısı (başka birimin kuyruğu) */
.pside-nav a .nav-ro{ margin-left:auto; font-size:11px; opacity:.55 }

/* Tek başvurunun işlem geçmişi görüntülenirken üstteki künye şeridi */
.log-basvuru{
  display:flex; align-items:center; gap:14px; flex-wrap:wrap;
  background:#fff; border:1px solid var(--line); border-left:4px solid var(--green);
  border-radius:12px; padding:14px 18px; margin-bottom:18px;
}
.log-basvuru .lb-ico{
  width:38px; height:38px; flex:0 0 38px; border-radius:10px;
  background:var(--green-100); color:var(--green);
  display:flex; align-items:center; justify-content:center; font-size:15px;
}
.log-basvuru .lb-body b{ display:block; font-size:14px; color:var(--ink) }
.log-basvuru .lb-body small{ font-size:12px; color:var(--muted) }
.log-basvuru .lb-actions{ margin-left:auto; display:flex; gap:8px; flex-wrap:wrap }

/* ---- Bilgi düzenleme modalı ---- */
.duzenle-kilitli{
  display:flex; gap:11px; align-items:flex-start;
  background:var(--navy-100); border:1px solid #d4e0ea; border-radius:10px;
  padding:12px 15px; margin-bottom:18px; font-size:12.5px; color:var(--navy); line-height:1.6;
}
.duzenle-kilitli i{ margin-top:2px; opacity:.75 }
.duzenle-kilitli b{ display:block; color:var(--navy) }
.duzenle-baslik{ font-size:12px; font-weight:700; letter-spacing:.5px; color:var(--navy) }
.duzenle-not{
  display:flex; gap:10px; align-items:flex-start;
  margin-top:20px; padding:11px 14px; background:#f7faf9;
  border:1px solid var(--line); border-radius:10px;
  font-size:12.5px; color:var(--muted); line-height:1.6;
}
.duzenle-not i{ color:var(--green); margin-top:2px }
#bilgiForm .form-control:disabled, #bilgiForm .form-select:disabled{
  background:#f4f6f7; color:var(--muted); border-style:dashed;
}

/* ---- Eski ruhsat çözümleme özeti ---- */
.el-ozet{
  display:grid; grid-template-columns:repeat(auto-fit, minmax(120px, 1fr)); gap:12px;
}
.el-ozet > div{
  border:1px solid var(--line); border-radius:12px; padding:14px 16px; background:#fbfdfc;
}
.el-ozet b{ display:block; font-size:24px; line-height:1.1; color:var(--navy) }
.el-ozet small{ display:block; margin-top:4px; font-size:12px; color:var(--muted) }

/* ---- Seçenek satırı (devir/yenileme numara seçimi) ---- */
.choice-satir{
  display:flex; gap:12px; align-items:flex-start;
  padding:14px 16px; border:1.5px solid var(--line); border-radius:12px;
  cursor:pointer; transition:.16s; background:#fff;
}
.choice-satir:hover{ border-color:#c9d6d1; background:#fbfdfc }
.choice-satir input{ margin-top:3px; flex:none }
.choice-satir b{ display:block; font-size:13.5px; color:var(--ink) }
.choice-satir small{ display:block; margin-top:3px; font-size:12.5px; color:var(--muted); line-height:1.5 }
.choice-satir:has(input:checked){
  border-color:var(--green); background:var(--green-100);
}
.choice-satir:has(input:focus-visible){ outline:3px solid var(--accent); outline-offset:2px }

/* ---- Nüfus sorgusu anahtarı (içerik ayarları) ---- */
.nufus-rozet{
  font-size:11.5px; font-weight:700; letter-spacing:.3px;
  padding:3px 11px; border-radius:999px;
}
.nufus-rozet.acik{ background:var(--green-100); color:var(--green-700) }
.nufus-rozet.kapali{ background:#fdeceb; color:var(--err) }

.nufus-anahtar{ padding-left:2.9em; margin-bottom:16px }
.nufus-anahtar .form-check-input{ width:2.3em; height:1.2em; margin-left:-2.9em; margin-top:.15em }
.nufus-anahtar .form-check-input:checked{ background-color:var(--green); border-color:var(--green) }
.nufus-anahtar b{ display:block; font-size:13.5px; color:var(--ink) }
.nufus-anahtar small{
  display:block; margin-top:3px; font-size:12.5px; color:var(--muted); line-height:1.55;
}

/* Simge ile metin akisi bozulmasin diye satir ici kalir: kalin uyari cumlesi
   ayri bir sutuna dusmez, metnin basinda yer alir. */
.nufus-uyari{ margin-bottom:0 }
.nufus-uyari b{ color:#7a4e14 }

.nufus-test{
  margin-top:16px; padding:15px 16px 16px;
  border:1.5px dashed #d8c3a4; border-radius:var(--radius-sm); background:#fffdf9;
}
.nufus-test[hidden]{ display:none }
.nufus-test-baslik{
  font-size:12px; font-weight:700; letter-spacing:.5px; text-transform:uppercase;
  color:#8a5a1c; margin-bottom:11px;
}
.nufus-test-not{
  margin-top:12px; font-size:12.5px; color:var(--muted); line-height:1.6;
}

/* ---- Ruhsat türü rozeti (faaliyet listesi) ---- */
.tur-rozet{
  display:inline-block; font-size:11.5px; font-weight:700;
  padding:3px 10px; border-radius:999px; white-space:nowrap;
}
.tur-sih{ background:var(--green-100); color:var(--green-700) }
.tur-gsm{ background:var(--accent-100); color:#8a5a1c }
.tur-uay{ background:var(--navy-100); color:var(--navy) }

/* ---- Ruhsat künyesinde arşiv klasörü ---- */
.ruhsat-klasor{
  margin-top:10px; padding-top:10px; border-top:1px dashed rgba(0,0,0,.14);
  font-size:12.5px; opacity:.92;
}
.ruhsat-klasor i{ margin-right:5px; opacity:.8 }
.ruhsat-klasor b{ font-weight:700; letter-spacing:.3px }

/* ---- İçkili yer listesi: etiket ve ruhsat sayısı ---- */
.etiket-rozet{
  display:inline-block; margin:2px 3px 2px 0; padding:3px 10px;
  font-size:11.5px; font-weight:600; text-decoration:none; white-space:nowrap;
  background:var(--navy-100); color:var(--navy); border-radius:999px; transition:.14s;
}
.etiket-rozet:hover{ background:var(--navy); color:#fff }

.ruhsat-adet{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:34px; padding:3px 9px; font-size:13px; font-weight:800;
  text-decoration:none; border-radius:999px; transition:.14s;
  background:var(--green-100); color:var(--green-700);
}
.ruhsat-adet:hover{ background:var(--green); color:#fff }
