/* ==========================================================================
   SİSTEM YÖNETİMİ (admin paneli)  —  gy.css + yonetim.css üstüne biner.
   Önek: sis- / sk- (giriş kapısı)

   RENK KİMLİĞİ AYRI VE BİLEREK AYRI: atölye paneli lacivert, burası MOR.
   İkisi birbirine benzeseydi yanlış panelde işlem yapmak an meselesiydi —
   burada yapılan bir hata tek atölyeyi değil hepsini etkiler.
   ========================================================================== */

/* 17 Eylül — Orhan: "yönetim panelini neye istinaden mor yaptın, bizim
   renk paletimize uy." Haklı: mor, ayrım için iyi de olsa kurumsal kimliğin
   dışındaydı. Menü ve vurgu artık gy.css'teki iş önlüğü mavisi.

   AYRIM NASIL KORUNUYOR: renkle değil, KİMLİKLE. Menünün tepesinde logo ve
   altında "SİSTEM YÖNETİMİ" yazıyor; menü başlıkları ve ekranlar atölye
   panelininkinden tamamen farklı. Yanlış panelde olduğunu ilk saniyede
   anlarsın. (Tepedeki mor şerit kaldırıldı — Orhan: "o bara gerek yok".) */
body.sis{
  --sis:var(--accent);
  --sis-soft:var(--accent-soft);
}

/* ---------- menü başlığı: logo + "sistem yönetimi" ---------- */
.sis-logo{padding:15px 14px 11px;border-bottom:1px solid var(--nav-rule);margin-bottom:8px}
.sis-logo a{display:flex;align-items:center;gap:11px;text-decoration:none;color:var(--nav-on)}
.sis-logo .amblem{width:36px;height:36px;flex:none;border-radius:9px;background:#fff;
  display:grid;place-items:center;padding:4px;box-sizing:border-box}
.sis-logo .amblem img{max-width:100%;max-height:100%;display:block;object-fit:contain}
.sis-logo span{display:flex;flex-direction:column;font-family:var(--font-display);
  font-size:13.5px;font-weight:700;line-height:1.25;min-width:0}
.sis-logo b{font-size:9px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
  color:var(--nav-ink-2);margin-top:2px}
body.sis .gy-nav a.on{background:var(--nav-2);color:#fff;box-shadow:inset 3px 0 0 var(--accent-lift)}

/* ---------- giriş kapısı ---------- */
body.sis-kapi{min-height:100vh;display:grid;place-items:center;
  background:radial-gradient(1200px 600px at 50% -10%, #1A3247 0%, #132434 58%, #0B151F 100%);
  padding:24px 16px}
.sk{width:100%;max-width:400px}
.sk-kart{background:var(--surface);border-radius:18px;padding:26px 24px 22px;
  box-shadow:0 24px 60px rgba(8,4,20,.5);border-top:4px solid var(--sis)}
.sk-bas{text-align:center;margin-bottom:20px}
/* Logo plakası: amblem beyaz zeminde dursun, koyu temada da okunsun. */
/* Logo plakası FLEX olmak zorunda. Grid'de `max-height:100%` yüzde
   değeri çözülemiyor ve logo plakanın dışına taşıyordu (17 Eyl'de canlı
   ekranda görüldü: 190x58 kutunun içinde 170x162 görsel). Flex'te yükseklik
   kesin bir değere oturduğu için taşma bitiyor; plaka da `fit-content` ile
   logoyu sarıyor, yanlarda boş beyaz kalmıyor. */
.sk-bas .ik{width:fit-content;max-width:200px;margin:0 auto 14px;padding:8px 12px;
  border-radius:12px;display:flex;align-items:center;justify-content:center;background:#fff;
  box-shadow:0 1px 2px rgba(15,25,34,.08)}
.sk-bas .ik img{max-width:100%;max-height:52px;width:auto;height:auto;
  display:block;object-fit:contain}
.sk-bas b{display:block;font-family:var(--font-display);font-size:19px;font-weight:800;
  color:var(--ink);letter-spacing:-.015em}
.sk-bas span{display:block;margin-top:3px;font-size:12.5px;color:var(--ink-3)}
.sk-form .alan{margin-bottom:13px}
.sk-hatirla{display:flex;align-items:center;gap:9px;margin:0 0 15px;font-size:13px;
  color:var(--ink-2);cursor:pointer}
.sk-hatirla input{width:17px;height:17px;accent-color:var(--sis);margin:0}
.sk-kart .btn-1{background:var(--sis);border-color:var(--sis)}
.sk-not{display:flex;gap:9px;align-items:flex-start;margin:18px 0 0;padding-top:15px;
  border-top:1px solid var(--rule);font-size:11.5px;line-height:1.6;color:var(--ink-3)}
.sk-not svg{width:15px;height:15px;flex:none;margin-top:2px;fill:none;stroke:currentColor;stroke-width:1.8}
.sk-not span{min-width:0}

/* ---------- parola bağlantısı kutusu ---------- */
.sis-baglanti{background:var(--sis-soft);border:1px solid var(--sis);border-radius:var(--r-lg);
  padding:14px 16px;margin-bottom:16px}
.sis-baglanti .b{display:flex;gap:11px;align-items:flex-start;margin-bottom:11px}
.sis-baglanti .b svg{width:19px;height:19px;flex:none;margin-top:1px;color:var(--sis);
  fill:none;stroke:currentColor;stroke-width:1.8}
.sis-baglanti .t b{display:block;font-size:14px;color:var(--ink)}
.sis-baglanti .t span{display:block;font-size:12px;color:var(--ink-2);margin-top:2px;line-height:1.55}
.sis-baglanti .k{display:flex;gap:9px;flex-wrap:wrap}
.sis-baglanti .input{flex:1 1 300px;min-width:0;font-size:12px}
.sis-baglanti .btn-1{background:var(--sis);border-color:var(--sis);flex:none}

/* ---------- özet kutuları ---------- */
.sis-kutular{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:14px}
.sis-kutu{background:var(--surface);border:1px solid var(--rule);border-radius:12px;
  padding:14px 16px;display:flex;flex-direction:column;gap:3px;text-decoration:none;color:inherit}
a.sis-kutu:hover{border-color:var(--rule-hard);text-decoration:none}
.sis-kutu .k{display:flex;align-items:center;gap:7px;font-family:var(--font-display);
  font-size:9.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
.sis-kutu .k svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2}
.sis-kutu .v{font-family:var(--font-mono);font-size:21px;font-weight:500;color:var(--ink);
  font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.sis-kutu .d{font-size:11.5px;color:var(--ink-3)}
.sis-kutu.buyuk{background:linear-gradient(160deg,var(--surface) 0%,var(--sis-soft) 100%);
  border-color:var(--sis)}
.sis-kutu.buyuk .v{font-size:26px;color:var(--sis)}
.sis-kutu.uyar{border-color:var(--warn)}
.sis-kutu.uyar .v{color:var(--warn)}
.sis-kutu.uyar .d b{color:var(--danger)}

/* ---------- şerit ---------- */
.sis-serit-x{display:none}
.sis-yerlesim{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:14px;align-items:start}
.sis-sol,.sis-sag{display:flex;flex-direction:column;gap:14px;min-width:0}

.gy-page .sis-serit,
.sis-rakamlar{margin-bottom:14px}

/* özet/detay şeridi — muhasebedeki dille aynı */
.gy-page .sis-serit{display:flex;align-items:stretch;gap:0;flex-wrap:wrap;position:static;
  background:var(--surface);border:1px solid var(--rule);border-radius:12px;
  padding:12px 4px;color:var(--ink);justify-content:flex-start}
.gy-page .sis-serit .ps{flex:1 1 170px;min-width:0;padding:2px 16px;display:flex;
  flex-direction:column;gap:2px;border-left:1px solid var(--rule);text-decoration:none;color:inherit}
.gy-page .sis-serit .ps:first-child{border-left:0}
.gy-page .sis-serit a.ps:hover{text-decoration:none}
.gy-page .sis-serit a.ps:hover b{color:var(--sis)}
.gy-page .sis-serit .ps-ayrac{width:0;border-left:2px dashed var(--rule-hard);margin:0 6px;flex:none}
.gy-page .sis-serit .e{font-family:var(--font-display);font-size:9.5px;font-weight:700;
  letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
.gy-page .sis-serit b{font-family:var(--font-mono);font-size:17px;font-weight:500;color:var(--ink);
  font-variant-numeric:tabular-nums;letter-spacing:0}
.gy-page .sis-serit .a{font-size:11.5px;color:var(--ink-3)}
.gy-page .sis-serit .ps.uyar b,.gy-page .sis-serit .ps.uyar .e{color:var(--warn)}

.sis-rakamlar{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}
.sis-rakamlar .r{background:var(--surface-2);border:1px solid var(--rule);border-radius:10px;
  padding:11px 13px;text-align:center}
.sis-rakamlar b{display:block;font-family:var(--font-mono);font-size:18px;font-weight:500;
  color:var(--ink);font-variant-numeric:tabular-nums}
.sis-rakamlar span{display:block;margin-top:2px;font-size:11px;color:var(--ink-3)}

/* ---------- listeler ---------- */
.card-sayi{font-family:var(--font-mono);font-size:11px;font-weight:400;letter-spacing:0;
  text-transform:none;color:var(--ink-3);border:1px solid var(--rule);border-radius:999px;padding:1px 8px}

.sis-liste{display:flex;flex-direction:column}
.sl{display:grid;grid-template-columns:minmax(0,1fr) 116px 108px;gap:12px;align-items:center;
  padding:10px 16px;border-top:1px solid var(--rule);text-decoration:none;color:inherit}
.sl:hover{background:var(--surface-2);text-decoration:none}
.sl .t{min-width:0}
.sl .t b{display:block;font-size:13.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sl .t span{display:block;font-size:11.5px;color:var(--ink-3);margin-top:1px}
.sl .tar{font-family:var(--font-mono);font-size:12px;color:var(--ink-2);white-space:nowrap}
.sl .gun{font-size:11.5px;color:var(--ink-3);text-align:right}
.sl.yakin .gun{color:var(--warn);font-weight:500}
.sl.gecti{background:var(--danger-soft)}
.sl.gecti .gun{color:var(--danger);font-weight:500}

/* BOŞ LİSTE — dikey ve ortalı.
   gy.css'te `img,svg{display:block}` var; blok bir öğe `text-align:center`
   ile ORTALANMAZ. Bu yüzden ikon sola yapışıyor, yazılar ortada kalıyordu
   (17 Eyl, canlı ekranda görüldü). Flex sütun hepsini birden hizalıyor. */
.sis-bos{display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:44px 20px;text-align:center;color:var(--ink-3);font-size:13px}
.sis-bos svg{width:32px;height:32px;margin:0 0 10px;fill:none;stroke:var(--ink-3);stroke-width:1.6}
.sis-bos b{color:var(--ink);font-size:15px;margin-bottom:3px}
.sis-bos .btn{margin-top:14px}
/* Düğmenin içindeki ikon yukarıdaki 32px kuralına kapılmasın. */
.sis-bos .btn svg{width:14px;height:14px;margin:0;stroke:currentColor;stroke-width:2}
.sis-bos-kucuk{margin:0;padding:22px 16px;text-align:center;font-size:13px;color:var(--ink-3)}
.sis-not-kucuk{margin:10px 0 0;font-size:11.5px;line-height:1.6;color:var(--ink-3)}

/* ---------- paket dağılımı ---------- */
.sis-paket{display:flex;flex-direction:column;gap:9px}
.sis-paket .pk{display:grid;grid-template-columns:96px minmax(0,1fr) 30px 92px;gap:10px;align-items:center}
.sis-paket .ad{font-size:12.5px;color:var(--ink-2)}
.sis-paket .cb{height:8px;background:var(--surface-3);border-radius:4px;overflow:hidden}
.sis-paket .cb i{display:block;height:100%;background:var(--sis);border-radius:4px}
.sis-paket .n{font-family:var(--font-mono);font-size:13px;color:var(--ink);text-align:right}
.sis-paket .tl{font-family:var(--font-mono);font-size:11.5px;color:var(--ink-3);text-align:right}

/* ---------- günlük ---------- */
.sis-gunluk{display:flex;flex-direction:column}
.sis-gunluk .gk{display:grid;grid-template-columns:104px minmax(0,1fr);gap:11px;align-items:baseline;
  padding:9px 16px;border-top:1px solid var(--rule)}
.sis-gunluk .z{font-family:var(--font-mono);font-size:11px;color:var(--ink-3);white-space:nowrap}
.sis-gunluk .t b{display:block;font-size:12.5px;font-weight:600;color:var(--ink)}
.sis-gunluk .t span{display:block;font-size:11px;color:var(--ink-3);margin-top:1px}
.sis-gunluk .gk.kotu{background:var(--danger-soft)}
.sis-gunluk .gk.kotu .t b{color:var(--danger)}

/* ---------- atölye listesi ---------- */
.sis-arac{padding:13px 14px 11px;margin-bottom:14px}
.sis-ara-satir{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap}
.sis-search{flex:1 1 280px;min-width:0}
.sis-search .input{height:42px}
.sis-ara-satir .btn{height:42px;flex:none}
.sis-sirala{display:flex;flex-direction:column;gap:4px;flex:0 0 auto;min-width:160px}
.sis-sirala>span{font-family:var(--font-display);font-size:9.5px;font-weight:700;letter-spacing:.12em;
  text-transform:uppercase;color:var(--ink-3)}
.sis-sirala .select{height:42px}
.sis-cipler{display:flex;gap:7px;flex-wrap:wrap;align-items:center;margin-top:12px}
.sis-cipler .cip{text-decoration:none}
.sis-cipler .cip.on{border-color:var(--sis);background:var(--sis-soft);color:var(--sis)}
.sis-ayrac{width:1px;height:20px;background:var(--rule-hard);margin:0 3px}

.sis-kart{padding:0;overflow:hidden}
.sis-bas,.sis-satir{display:grid;
  grid-template-columns:minmax(0,1.4fr) 108px 84px 138px 74px 74px 104px 18px;
  gap:12px;align-items:center;padding:11px 16px}
.sis-bas{font-family:var(--font-display);font-size:9.5px;font-weight:700;letter-spacing:.14em;
  text-transform:uppercase;color:var(--ink-3);border-bottom:1px solid var(--rule)}
.sis-bas .ort{text-align:center}
.sis-satir{border-bottom:1px solid var(--rule);text-decoration:none;color:inherit;transition:background .1s}
.sis-satir:last-child{border-bottom:0}
.sis-satir:hover{background:var(--surface-2);text-decoration:none}
.sis-satir .ad{min-width:0}
.sis-satir .ad b{display:block;font-size:14px;font-weight:600;color:var(--ink);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sis-satir .alt{display:flex;align-items:center;gap:6px;margin-top:3px}
.sis-satir .slug{font-family:var(--font-mono);font-size:11.5px;color:var(--ink-3)}
.sis-satir .sayi{font-family:var(--font-mono);font-size:13px;color:var(--ink-2);
  font-variant-numeric:tabular-nums}
.sis-satir .ort{text-align:center}
.sis-satir .tar{font-family:var(--font-mono);font-size:11.5px;color:var(--ink-3);white-space:nowrap}
.sis-satir .bitis{font-family:var(--font-mono);font-size:12px;color:var(--ink-2);white-space:nowrap}
.sis-satir .bitis i{display:block;font-style:normal;font-size:10.5px;color:var(--ink-3)}
.sis-satir .bitis.yakin{color:var(--warn)}
.sis-satir .bitis.yakin i{color:var(--warn)}
.sis-satir .bitis.gecti{color:var(--danger)}
.sis-satir .bitis.gecti i{color:var(--danger);font-weight:500}
.sis-satir .bitis .yok{font-family:var(--font);color:var(--ink-3);font-style:italic}
.sis-satir .ok{width:16px;height:16px;fill:none;stroke:var(--ink-3);stroke-width:2}

/* paket ve durum etiketleri */
.paket,.durum{display:inline-flex;align-items:center;justify-content:center;
  font-family:var(--font-display);font-size:9.5px;font-weight:700;letter-spacing:.09em;
  text-transform:uppercase;padding:3px 8px;border-radius:5px;border:1px solid currentColor;
  line-height:1.3;white-space:nowrap}
.paket-deneme{color:var(--ink-3)}
.paket-baslangic{color:var(--accent)}
.paket-profesyonel{color:var(--sis)}
.paket-kurumsal{color:var(--haz)}
.d-aktif{color:var(--ok);background:var(--ok-soft);border-color:transparent}
.d-askida{color:var(--warn);background:var(--warn-soft);border-color:transparent}
.d-iptal{color:var(--danger);background:var(--danger-soft);border-color:transparent}
.roz{display:inline-flex;align-items:center;gap:4px;font-family:var(--font-display);
  font-size:9px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;
  padding:2px 6px;border-radius:4px;border:1px solid currentColor;line-height:1.3}
.roz-demo{color:var(--warn)}

/* ---------- atölye detayı: kullanıcılar ---------- */
.sis-kul{display:flex;flex-direction:column}
.ku{display:grid;grid-template-columns:38px minmax(0,1fr) 104px auto;gap:11px;align-items:center;
  padding:10px 16px;border-top:1px solid var(--rule)}
.ku em{font-style:normal;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;
  background:var(--sis-soft);color:var(--sis);font-family:var(--font-display);font-weight:800;font-size:13px}
.ku .t{min-width:0}
.ku .t b{display:block;font-size:13.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ku .t span{display:block;font-size:11.5px;color:var(--ink-3);margin-top:1px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ku .t i{font-style:normal;color:var(--danger)}
.ku .tar{font-family:var(--font-mono);font-size:11.5px;color:var(--ink-3);white-space:nowrap}
.ku .eyl{display:flex;gap:5px}
.ku .eyl .btn{padding:7px 9px}
.ku .eyl svg{margin:0}
.ku.kapali{opacity:.55}
.sis-kul-ekle{border-top:1px solid var(--rule)}
.sis-satir-form{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap}
.sis-satir-form .alan{flex:1 1 150px;min-width:0;margin:0}
.sis-satir-form .btn{flex:none;height:42px}

/* ---------- abonelik geçmişi ---------- */
.sis-abone{display:flex;flex-direction:column}
.ab{display:grid;grid-template-columns:minmax(0,1fr) 108px 110px 150px;gap:11px;align-items:center;
  padding:10px 16px;border-top:1px solid var(--rule);font-size:12.5px}
.ab .don{font-family:var(--font-mono);font-size:12px;color:var(--ink-2)}
.ab .pk{font-size:12px;color:var(--ink-3)}
.ab .tut{font-family:var(--font-mono);font-size:13.5px;color:var(--ink);text-align:right;
  font-variant-numeric:tabular-nums}
.ab .dur{display:flex;justify-content:flex-end}
.ab .dur i{font-style:normal;font-size:11.5px;color:var(--ok)}
.ab.bekliyor{background:var(--warn-soft)}

/* ---------- sağ sütun formları ---------- */
.sis-form .alan{margin-bottom:12px}
.sis-form .ac-anahtar{margin-bottom:12px}
.sis-kisa{display:flex;gap:9px;align-items:center;margin-bottom:11px}
.sis-kisa .select{flex:1;min-width:0}
.sis-kisa .btn{flex:none}
.sat-bilgi{display:flex;flex-direction:column;gap:2px;margin:-4px 0 4px}
.sat-bilgi .e{font-family:var(--font-display);font-size:9.5px;font-weight:700;letter-spacing:.11em;
  text-transform:uppercase;color:var(--ink-3)}
.sat-bilgi .v{font-family:var(--font-mono);font-size:12.5px;color:var(--sis);text-decoration:none}
.sat-bilgi .v:hover{text-decoration:underline}

/* ---------- yeni atölye ---------- */
.sis-yeni{display:flex;flex-direction:column;gap:14px;max-width:760px}
.sis-yeni-dip{display:flex;gap:10px}
.sis-slug{display:flex;align-items:center;gap:0}
.sis-slug .input{border-top-right-radius:0;border-bottom-right-radius:0;min-width:0}
.sis-slug .son{font-family:var(--font-mono);font-size:12.5px;color:var(--ink-3);
  background:var(--surface-3);border:1px solid var(--rule);border-left:0;
  border-radius:0 var(--r) var(--r) 0;padding:0 11px;height:42px;display:flex;align-items:center;
  white-space:nowrap}

/* ==========================================================================
   DAR EKRAN
   ========================================================================== */
@media (max-width:1180px){
  .sis-kutular{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sis-yerlesim{grid-template-columns:1fr}
  .sis-rakamlar{grid-template-columns:repeat(3,minmax(0,1fr))}
  .sis-bas,.sis-satir{grid-template-columns:minmax(0,1.3fr) 98px 78px 128px 66px 96px 18px}
  .sis-bas span:nth-child(6),.sis-satir .sayi:nth-of-type(1){display:none}
}

@media (max-width:900px){
  .sis-bas{display:none}
  .sis-satir{grid-template-columns:minmax(0,1fr) auto;
    grid-template-areas:"ad durum" "paket bitis" "tar sayi";row-gap:7px}
  .sis-satir .ad{grid-area:ad}
  .sis-satir .durum{grid-area:durum;justify-self:end}
  .sis-satir .paket{grid-area:paket;justify-self:start}
  .sis-satir .bitis{grid-area:bitis;text-align:right}
  .sis-satir .tar{grid-area:tar}
  .sis-satir .sayi{display:none}
  .sis-satir .ok{display:none}

  .ab{grid-template-columns:minmax(0,1fr) auto;
    grid-template-areas:"don tut" "pk dur";row-gap:6px}
  .ab .don{grid-area:don}.ab .tut{grid-area:tut}.ab .pk{grid-area:pk}.ab .dur{grid-area:dur}

  .ku{grid-template-columns:38px minmax(0,1fr) auto;
    grid-template-areas:"em t t" "em tar eyl";row-gap:6px}
  .ku em{grid-area:em}.ku .t{grid-area:t}.ku .tar{grid-area:tar}.ku .eyl{grid-area:eyl}
}

@media (max-width:760px){
  .gy-page .sis-serit .ps-ayrac{display:none}
  .gy-page .sis-serit .ps{flex:1 1 44%;border-left:0}
  .sis-rakamlar{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sis-search{flex:1 1 100%}
  .sis-sirala{flex:1 1 100%}
  .sis-ara-satir .btn{flex:1 1 100%;justify-content:center}
  .sl{grid-template-columns:minmax(0,1fr) auto;
    grid-template-areas:"t tar" "gun gun";row-gap:5px}
  .sl .t{grid-area:t}.sl .tar{grid-area:tar}.sl .gun{grid-area:gun;text-align:left}
}

@media (max-width:560px){
  .sis-kutular{grid-template-columns:1fr}
  .sis-yeni-dip{flex-direction:column}
  .sis-yeni-dip .btn{width:100%;justify-content:center}
  .sis-satir-form .alan{flex:1 1 100%}
  .sis-satir-form .btn{width:100%;justify-content:center}
  .sis-serit span{font-size:11.5px}
}

/* ---------- yönetim muhasebesi ---------- */
.sis-aciklama{margin-bottom:14px}
.sis-gider-ekle{border-bottom:1px solid var(--rule)}
.ab .don a{color:var(--ink);text-decoration:none;font-weight:600}
.ab .don a:hover{color:var(--accent);text-decoration:underline}
.ab .pk .gec{font-style:normal;color:var(--danger);font-weight:500}
.ab.gecikti{background:var(--danger-soft)}

.mh-lejant{display:flex;align-items:center;gap:10px;font-family:var(--font);font-size:11px;
  font-weight:400;letter-spacing:0;text-transform:none;color:var(--ink-3)}
.mh-lejant i{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:4px;
  vertical-align:-1px}
.mh-lejant .l-gelir{background:var(--ok)}
.mh-lejant .l-gider{background:var(--danger)}

.sis-ay{display:grid;grid-template-columns:44px minmax(0,1fr) 108px;gap:11px;align-items:center;
  padding:7px 0}
.sis-ay .ad{font-family:var(--font-mono);font-size:11.5px;color:var(--ink-3);text-transform:uppercase}
.sis-ay.bugun .ad{color:var(--ink);font-weight:500}
.sis-ay .cb{position:relative;height:20px;background:var(--surface-3);border-radius:5px;overflow:hidden}
.sis-ay .cb i{position:absolute;left:0;display:block;transition:width .4s cubic-bezier(.3,.1,.2,1)}
.sis-ay .cb i.gelir{top:3px;height:6px;background:var(--ok);border-radius:3px}
.sis-ay .cb i.gider{bottom:3px;height:6px;background:var(--danger);border-radius:3px}
.sis-ay .net{font-family:var(--font-mono);font-size:13px;text-align:right;color:var(--ok);
  font-variant-numeric:tabular-nums}
.sis-ay .net.zarar{color:var(--danger)}

@media (max-width:900px){
  .ab.gecikti,.ab.bekliyor{grid-template-columns:minmax(0,1fr) auto}
}

/* ==========================================================================
   GÜVENLİK — giriş kayıtları, kilitler, kim online
   ==========================================================================
   NOT: .gk-bas / .gk-satir kendi sütun düzenini kurar. Dosyanın yukarısında
   .sis-bas/.sis-satir için yazılmış medya sorguları BURADAN ÖNCE geldiği
   için iki sınıflı seçici (.sis-satir.gk-satir) kullanıyoruz; tek sınıfla
   yazılsaydı mobil kural bunu ezerdi. (Bugün .ms-is.ar-is ile aynı tuzak.) */

.sis-bas.gk-bas,.sis-satir.gk-satir{
  grid-template-columns:104px minmax(0,1.3fr) 168px minmax(0,150px) minmax(0,150px)}

.sis-satir.gk-satir{cursor:default}
.sis-satir.gk-satir:hover{background:transparent}
.sis-satir.gk-satir.hata{background:color-mix(in srgb,var(--danger) 4%,transparent)}

.gk-satir .tar i{display:block;font-style:normal;font-size:10.5px;color:var(--ink-3)}

.gk-satir .sonuc{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gk-satir .sonuc svg{flex:none;width:14px;height:14px;fill:none;stroke-width:2.2}
.gk-satir .sonuc.ok{color:var(--ok)}
.gk-satir .sonuc.ok svg{stroke:var(--ok)}
.gk-satir .sonuc.no{color:var(--danger)}
.gk-satir .sonuc.no svg{stroke:var(--danger)}

.gk-satir .konum{font-size:12.5px;color:var(--ink-2);min-width:0}
.gk-satir .konum i{display:block;font-style:normal;font-size:11px;color:var(--ink-3)}
.gk-satir .cihaz{font-size:11.5px;color:var(--ink-3);min-width:0;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.roz-sistem{color:var(--accent)}
.roz-patron{color:var(--ink-2)}
.roz-usta{color:var(--ink-3)}

/* ---------- açık kilitler ---------- */
.gk-kilit{border-color:color-mix(in srgb,var(--danger) 35%,var(--rule))}
.gk-kilit-liste{display:flex;flex-direction:column}
.gk-kilit-satir{display:grid;grid-template-columns:64px minmax(0,1fr) 168px auto;
  gap:12px;align-items:center;padding:11px 0;border-bottom:1px solid var(--rule)}
.gk-kilit-satir:last-child{border-bottom:0}
.gk-kilit-satir .tur{display:inline-flex;align-items:center;justify-content:center;
  font-family:var(--font-display);font-size:9.5px;font-weight:700;letter-spacing:.09em;
  text-transform:uppercase;padding:4px 7px;border-radius:5px;
  color:var(--danger);border:1px solid currentColor}
.gk-kilit-satir .d{min-width:0}
.gk-kilit-satir .d b{display:block;font-size:13.5px;font-weight:600;color:var(--ink);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gk-kilit-satir .d span{display:block;margin-top:2px;font-size:12px;color:var(--ink-3)}
.gk-kilit-satir .sure{font-family:var(--font-mono);font-size:11.5px;color:var(--ink-2);
  white-space:nowrap}
.gk-kilit-satir .sure i{display:block;font-style:normal;font-size:10.5px;color:var(--ink-3)}
.gk-not{margin:12px 0 0;font-size:11.5px;line-height:1.6;color:var(--ink-3)}

/* ---------- sayfalama ---------- */
.sis-sayfa{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:14px}
.sis-sayfa .no{font-family:var(--font-mono);font-size:12px;color:var(--ink-3);
  font-variant-numeric:tabular-nums}
.sis-sayfa .pasif{opacity:.4;pointer-events:none}

.sis-dip{margin:14px 0 0;font-size:11.5px;line-height:1.6;color:var(--ink-3);text-align:center}

/* ---------- kim online ---------- */
.on-liste{display:flex;flex-direction:column}
.on-satir{display:grid;grid-template-columns:10px minmax(0,1fr) 150px 170px;gap:12px;
  align-items:center;padding:10px 0;border-bottom:1px solid var(--rule)}
.on-satir:last-child{border-bottom:0}
.on-satir .nokta{width:9px;height:9px;border-radius:50%;background:var(--rule-hard)}
.on-satir .nokta.n-on{background:var(--ok);box-shadow:0 0 0 3px color-mix(in srgb,var(--ok) 22%,transparent)}
.on-satir .nokta.n-bugun{background:var(--warn)}
.on-satir .nokta.n-eski,.on-satir .nokta.n-yok{background:var(--rule)}
.on-satir .t{min-width:0}
.on-satir .t b{display:block;font-size:13.5px;font-weight:600;color:var(--ink);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.on-satir .t span{display:block;margin-top:2px;font-size:11.5px;color:var(--ink-3);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.on-satir .gor{font-size:12px;color:var(--ink-3);white-space:nowrap}
.on-satir .gor.g-on{color:var(--ok);font-weight:500}
.on-satir .gor.g-bugun{color:var(--ink-2)}
.on-satir .tar{font-family:var(--font-mono);font-size:11.5px;color:var(--ink-3);
  text-align:right;white-space:nowrap}

@media (max-width:900px){
  .sis-bas.gk-bas{display:none}
  .sis-satir.gk-satir{grid-template-columns:minmax(0,1fr) auto;
    grid-template-areas:"ad sonuc" "tar konum" "cihaz cihaz";row-gap:6px}
  .gk-satir .ad{grid-area:ad}
  .gk-satir .sonuc{grid-area:sonuc;justify-self:end}
  .gk-satir .tar{grid-area:tar}
  .gk-satir .konum{grid-area:konum;text-align:right}
  .gk-satir .cihaz{grid-area:cihaz}

  .gk-kilit-satir{grid-template-columns:64px minmax(0,1fr);
    grid-template-areas:"tur d" "sure sure" "btn btn";row-gap:8px}
  .gk-kilit-satir .tur{grid-area:tur}
  .gk-kilit-satir .d{grid-area:d}
  .gk-kilit-satir .sure{grid-area:sure}
  .gk-kilit-satir form{grid-area:btn}
  .gk-kilit-satir form .btn{width:100%;justify-content:center}

  .on-satir{grid-template-columns:10px minmax(0,1fr) auto;
    grid-template-areas:"nokta t gor" ". tar tar";row-gap:4px}
  .on-satir .nokta{grid-area:nokta}
  .on-satir .t{grid-area:t}
  .on-satir .gor{grid-area:gor;justify-self:end}
  .on-satir .tar{grid-area:tar;text-align:left}
}

/* ==========================================================================
   FORM ALANI — temel kural
   ==========================================================================
   .alan'ın temel biçimi panel.css'te tanımlı ama bu panel panel.css'i
   YÜKLEMİYOR (bkz. layouts/sistem.blade.php). Etiket ile kutu alt alta
   dursun diye kuralı burada tekrar ediyoruz. Aynı tuzağa bugün modal
   biçimlerinde de düştük. */
.sis .alan{display:block;margin-bottom:12px}
.sis .alan>span{display:block;margin-bottom:5px;font-family:var(--font-display);
  font-size:10px;font-weight:700;letter-spacing:.11em;text-transform:uppercase;color:var(--ink-3)}
.sis .alan>span i{font-style:normal;font-family:var(--font-mono);font-size:11px;
  letter-spacing:0;text-transform:none;color:var(--ink-3)}
.sis .alan .input,.sis .alan .select,.sis .alan textarea{width:100%}

/* ==========================================================================
   BAKIM VE DUYURU
   ========================================================================== */
.bk-suren{display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  border-color:color-mix(in srgb,var(--warn) 45%,var(--rule));background:var(--warn-soft)}
.bk-suren .b{display:flex;align-items:flex-start;gap:11px;flex:1 1 260px;min-width:0}
.bk-suren .b>svg{width:20px;height:20px;flex:none;margin-top:1px;fill:none;
  stroke:var(--warn);stroke-width:2}
.bk-suren .t b{display:block;font-size:14.5px;font-weight:700;color:var(--ink)}
.bk-suren .t span{display:block;margin-top:3px;font-size:12.5px;line-height:1.6;color:var(--ink-2)}

.bk-satir{display:flex;gap:11px;flex-wrap:wrap}
.bk-satir .alan{flex:1 1 140px;min-width:0}
.bk-form .onay{display:flex;align-items:flex-start;gap:10px;margin:2px 0 14px;padding:11px 12px;
  background:var(--surface-2);border:1px solid var(--rule);border-radius:10px;cursor:pointer}
.bk-form .onay input{width:18px;height:18px;flex:none;margin:1px 0 0;accent-color:var(--accent)}
.bk-form .onay span{font-size:12.5px;line-height:1.6;color:var(--ink-2)}
.bk-form .onay b{color:var(--ink)}

.bk-liste{display:flex;flex-direction:column}
.bk{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 12px;
  padding:13px 0;border-bottom:1px solid var(--rule)}
.bk:last-child{border-bottom:0}
.bk.gecmis,.bk.iptal{opacity:.55}
.bk .t{min-width:0}
.bk .t b{display:block;font-size:13.5px;font-weight:600;color:var(--ink)}
.bk .t span{display:block;margin-top:3px;font-size:12px;line-height:1.55;color:var(--ink-3)}
.bk .dur{align-self:start;justify-self:end;font-family:var(--font-display);font-size:9.5px;
  font-weight:700;letter-spacing:.09em;text-transform:uppercase;padding:3px 7px;
  border-radius:5px;border:1px solid currentColor;white-space:nowrap}
.bk .dur.d-bekliyor{color:var(--accent)}
.bk .dur.d-suruyor{color:var(--warn)}
.bk .dur.d-gecmis{color:var(--ink-3)}
.bk .dur.d-iptal{color:var(--danger)}
.bk .duy{grid-column:1/-1;display:inline-flex;align-items:center;gap:6px;
  font-size:11.5px;color:var(--ink-3)}
.bk .duy svg{width:13px;height:13px;flex:none;fill:none;stroke:currentColor;stroke-width:2}
.bk-dug{grid-column:1/-1;display:flex;gap:8px;margin-top:4px}

/* ==========================================================================
   BAŞKA DOSYADA TANIMLI OLUP BURADA EKSİK KALAN PARÇALAR
   ==========================================================================
   Bu panel yalnızca gy.css + yonetim.css + sistem.css yüklüyor. Aynı
   sınıfın panel.css / muhasebe.css / musteri.css'teki tanımı buraya
   ULAŞMIYOR — sınıf sanki varmış gibi yazılınca ekranda biçimsiz çıkıyor.
   (Muhasebe ekranındaki dev "i" ikonu tam olarak buydu.) */

/* açıklama kutusu (.mh-not ile birlikte kullanılır) */
.sis-aciklama{display:flex;gap:10px;align-items:flex-start;margin:0 0 14px;
  padding:11px 13px;border-radius:10px;font-size:12.5px;line-height:1.6;
  color:var(--ink-2);background:var(--surface-2);border:1px solid var(--rule)}
.sis-aciklama svg{width:17px;height:17px;flex:none;margin-top:2px;fill:none;
  stroke:var(--ink-3);stroke-width:2}
.sis-aciklama span{min-width:0}
.sis-aciklama b{color:var(--ink)}

/* sıralama kutusu (musteri.css'teki .ms-sirala'nın karşılığı) */
.ms-sirala{display:flex;flex-direction:column;gap:4px;flex:0 0 auto;min-width:140px}
.ms-sirala>span{font-family:var(--font-display);font-size:9.5px;font-weight:700;
  letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
.ms-sirala .select{height:42px}

/* dar ekranda düğme yazısını gizleyen yardımcı */
@media (max-width:560px){
  .sis-ara-satir .btn .yz{display:none}
  .ms-sirala{flex:1 1 100%;min-width:0}
}
