/*
 * YÖNETİM PANELİ — Duralux temasının üstüne ince katman.
 *
 * Tema (bootstrap.min.css + theme.min.css) olduğu gibi kullanılır; burada
 * yalnız markamıza ve bu panele özgü bileşenler var. Tema dosyasını
 * düzenlemeyin: yeni bir Duralux sürümü geldiğinde üzerine yazılabilsin.
 */

:root {
  --y-amber: #f59e0b;
  --y-amber-soft: rgba(245, 158, 11, .12);
  /* olay_ton() eski tasarımın renk adlarını döndürür (var(--tehlike) …);
     Duralux paletine eşlenir, yoksa olay akışındaki noktalar renksiz kalır. */
  --tehlike: #d13b4c;
  --uyari: #e49e3d;
  --basari: #25b865;
  --bilgi: #1E6BFF;
}

body { font-family: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif; }

/* Duralux .btn'i blok düzeyinde flex yapar; yan yana iki düğme (tabloda
   "Ödendi" + "Aç") alt alta düşüyordu. Satır içi flex: hizalama aynı,
   akış satır içi. w-100 olanlar yine tam genişlik kalır. */
.btn { display: inline-flex; }
.y-tablo .y-eylem form { display: inline-flex; }
.y-tablo .y-eylem > * + *, .y-tablo .y-eylem form + .btn { margin-left: 4px; }

/* Alt bilgi kısa sayfalarda da ekranın dibinde dursun: kap zaten en az
   ekran yüksekliğinde (tema), içerik kalan alanı doldurur. */
.nxl-container { display: flex; flex-direction: column; }
.nxl-container > .nxl-content { flex: 1 0 auto; }

/* Menü öğesi: rozet sağa yaslansın diye flex. */
.nxl-navbar > .nxl-item > .nxl-link { display: flex; align-items: center; }

/* ── Marka ─────────────────────────────────────────────────────────── */
.y-marka { display: flex; align-items: center; gap: 10px; text-decoration: none; }
.y-marka svg { flex: 0 0 auto; }
.y-marka-ad { display: flex; flex-direction: column; line-height: 1.15; }
.y-marka-ad b { font-size: 15px; color: #283c50; letter-spacing: -.02em; }
.y-marka-ad small { font-size: 10px; letter-spacing: .14em; text-transform: uppercase; color: #64748b; }
html.app-skin-dark .y-marka-ad b { color: #e2e8f0; }
html.minimenu .nxl-navigation:not(:hover) .y-marka-ad { display: none; }

/* Yönetim paneli kiracı panelinden AYIRT EDİLEBİLİR olmalı: üst çubukta
   kehribar "YÖNETİM" etiketi. Yanlış panelde işlem yapmak gerçek risktir. */
.y-etiket {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 10px; border-radius: 6px;
  background: var(--y-amber-soft); color: #b45309;
  font-size: 11px; font-weight: 700; letter-spacing: .12em;
}
html.app-skin-dark .y-etiket { color: var(--y-amber); }

/* Tema düğmesi: ay / güneş simgesi (yonetim.js biri gizler). */
.y-tema-ay, .y-tema-gunes { display: inline-flex; }

/* Menü rozeti */
.nxl-navbar .nxl-link .y-menu-rozet {
  margin-left: auto; min-width: 20px; height: 20px; padding: 0 6px;
  border-radius: 10px; display: inline-flex; align-items: center; justify-content: center;
  font-size: 11px; font-weight: 700; line-height: 1;
}
html.minimenu .nxl-navigation:not(:hover) .y-menu-rozet { display: none; }

/* Üst çubuk arama */
.y-ara { position: relative; width: min(340px, 40vw); }
.y-ara .form-control { padding-left: 38px; height: 40px; border-radius: 10px; }
.y-ara i { position: absolute; left: 13px; top: 50%; transform: translateY(-50%); color: #94a3b8; }
@media (max-width: 767.98px) { .y-ara { display: none; } }

/* ── Kartlar ve istatistik ─────────────────────────────────────────── */
.y-ist { display: flex; align-items: center; gap: 16px; }
.y-ist-deger { font-size: 24px; font-weight: 700; color: #283c50; line-height: 1.1; letter-spacing: -.02em; }
html.app-skin-dark .y-ist-deger { color: #e2e8f0; }
.y-ist-et { font-size: 12.5px; color: #64748b; font-weight: 500; }
.y-ist-alt { font-size: 12px; margin-top: 4px; }
.y-ist a.stretched-link { z-index: 1; }

/* Eylem merkezi: yapılacak iş satırları */
.y-is { display: flex; align-items: center; gap: 12px; padding: 12px 0; border-bottom: 1px dashed #e5e7eb; }
.y-is:last-child { border-bottom: 0; }
.y-is-gv { min-width: 0; flex: 1; }
.y-is-gv b { display: block; font-size: 13.5px; color: #283c50; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.y-is-gv span { display: block; font-size: 12px; color: #64748b; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
html.app-skin-dark .y-is { border-color: #1b2436; }
html.app-skin-dark .y-is-gv b { color: #e2e8f0; }

.y-hepsi-tamam { text-align: center; padding: 26px 12px; color: #64748b; font-size: 13px; }
.y-hepsi-tamam i { font-size: 28px; color: #25b865; display: block; margin-bottom: 8px; }

/* Boş durum */
.y-bos { text-align: center; padding: 40px 16px; }
.y-bos i { font-size: 30px; color: #94a3b8; }
.y-bos h6 { margin: 12px 0 4px; font-weight: 600; }
.y-bos p { color: #64748b; font-size: 13px; margin: 0 auto; max-width: 420px; }

/* Bekleme süresi rengi */
.y-bekleme { font-weight: 600; font-size: 12px; white-space: nowrap; }
.y-bekleme.taze { color: #25b865; }
.y-bekleme.orta { color: #e49e3d; }
.y-bekleme.gec  { color: #d13b4c; }

/* Tablolar */
.table td, .table th { vertical-align: middle; }
.y-tablo td .y-alt { display: block; font-size: 12px; color: #64748b; }
.y-tablo .y-eylem { white-space: nowrap; width: 1%; }
.y-tablo .y-eylem form { display: inline; }
.y-kod { font-family: "JetBrains Mono", ui-monospace, Consolas, monospace; font-size: 12px; }
.y-tablo td.y-kod, .y-tablo td > .y-kod { white-space: nowrap; }

/* Mobilde tablolar yatay kayar; sayfa kaymaz. */
.y-tablo-sar { overflow-x: auto; -webkit-overflow-scrolling: touch; }

/* Destek yazışması */
.y-mesaj { display: flex; gap: 12px; margin-bottom: 18px; }
.y-mesaj-gv { flex: 1; min-width: 0; border-radius: 12px; padding: 12px 14px; background: #f8fafc; border: 1px solid #eef2f7; }
.y-mesaj.yonetim .y-mesaj-gv { background: rgba(30,107,255, .06); border-color: rgba(30,107,255, .15); }
.y-mesaj.sistem .y-mesaj-gv { background: rgba(209, 59, 76, .05); border-color: rgba(209, 59, 76, .18); }
.y-mesaj-bas { display: flex; justify-content: space-between; gap: 10px; font-size: 12px; color: #64748b; margin-bottom: 6px; }
.y-mesaj-bas b { color: #283c50; }
.y-mesaj-metin { white-space: pre-wrap; word-break: break-word; font-size: 13.5px; color: #334155; }
html.app-skin-dark .y-mesaj-gv { background: #121a2d; border-color: #1b2436; }
html.app-skin-dark .y-mesaj-bas b, html.app-skin-dark .y-mesaj-metin { color: #cbd5e1; }

.y-ek { display: inline-block; width: 96px; height: 72px; border-radius: 8px; overflow: hidden; border: 1px solid #e5e7eb; margin: 6px 6px 0 0; }
.y-ek img { width: 100%; height: 100%; object-fit: cover; }

/* Sekme şeridi (destek süzgeçleri, hesap sekmeleri) */
.y-sekmeler { display: flex; gap: 6px; flex-wrap: wrap; }
.y-sekmeler .btn .badge { margin-left: 6px; }

/* Hesap başlığı */
.y-hesap-bas { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.y-hesap-bas .avatar-text { width: 56px; height: 56px; font-size: 20px; }

/* Veri satırı (anahtar → değer) */
.y-veri { display: flex; justify-content: space-between; gap: 12px; padding: 9px 0; border-bottom: 1px dashed #e5e7eb; font-size: 13px; }
.y-veri:last-child { border-bottom: 0; }
.y-veri span { color: #64748b; }
.y-veri b { color: #283c50; text-align: right; font-weight: 600; }
html.app-skin-dark .y-veri { border-color: #1b2436; }
html.app-skin-dark .y-veri b { color: #e2e8f0; }

/* Zaman akışı (olaylar) */
.y-akis { list-style: none; margin: 0; padding: 0; }
.y-akis li { position: relative; padding: 0 0 14px 22px; font-size: 13px; }
.y-akis li::before { content: ""; position: absolute; left: 4px; top: 6px; width: 8px; height: 8px; border-radius: 50%; background: var(--y-ton, #1E6BFF); }
.y-akis li::after { content: ""; position: absolute; left: 7px; top: 18px; bottom: 2px; width: 2px; background: #eef2f7; }
.y-akis li:last-child::after { display: none; }
.y-akis time { display: block; font-size: 11.5px; color: #94a3b8; }
html.app-skin-dark .y-akis li::after { background: #1b2436; }

/* Bildirim açılır menüsü */
.nxl-notifications-menu .y-bil { display: flex; gap: 12px; padding: 12px 16px; border-bottom: 1px solid #f1f5f9; text-decoration: none; }
.nxl-notifications-menu .y-bil:hover { background: #f8fafc; }
.nxl-notifications-menu .y-bil.okunmamis { background: rgba(30,107,255, .05); }
.nxl-notifications-menu .y-bil b { display: block; font-size: 13px; color: #283c50; font-weight: 600; line-height: 1.35; }
.nxl-notifications-menu .y-bil time { font-size: 11.5px; color: #94a3b8; }
.y-bil-liste { max-height: 380px; overflow-y: auto; }
html.app-skin-dark .nxl-notifications-menu .y-bil { border-color: #1b2436; }
html.app-skin-dark .nxl-notifications-menu .y-bil:hover { background: #121a2d; }
html.app-skin-dark .nxl-notifications-menu .y-bil b { color: #e2e8f0; }

/* Göç uyarısı */
.y-goc { border-left: 4px solid var(--y-amber); }

/* QR kutusu (2FA) */
.y-qr { width: 196px; height: 196px; border-radius: 12px; border: 1px solid #e5e7eb; padding: 8px; background: #fff; }
.y-qr canvas, .y-qr img { width: 100%; height: 100%; }

/* Giriş ekranı */
.y-giris-zemin {
  min-height: 100vh; display: grid; place-items: center; padding: 24px;
  background: radial-gradient(900px 480px at 50% -10%, #1e293b, #0f172a 62%), #0f172a;
}
.y-giris-kart { width: min(420px, 100%); border-top: 3px solid var(--y-amber); }

/* Fatura kalem satırları */
.y-kalem .form-control { min-width: 0; }

/* Yazdırma: yalnız içerik */
@media print {
  .nxl-navigation, .nxl-header, .page-header-right, .y-yazdirma-gizle { display: none !important; }
  .nxl-container { margin: 0 !important; padding: 0 !important; }
}

/* Dar ekranlar: 320 px'te yatay sayfa kayması olmasın.
   Şablon başlık düğmelerini mobilde kendi çekmecesine taşır; biz düz
   düğme kullandığımız için başlığı sarmalı yapıyoruz — aksi hâlde sabit
   konumlu başlık sayfayı genişletip zil ve profil simgesini ekran dışına
   itiyordu. */
@media (max-width: 767.98px) {
  .page-header { flex-wrap: wrap; gap: 8px; padding: 12px 16px; }
  .page-header .breadcrumb { display: none; }
  .page-header h5 { border-right: 0; }
  .page-header .page-header-right { margin-left: 0 !important; width: 100%; }
  .page-header .page-header-right .btn { padding: 8px 12px; }
  .page-header + .nxl-content, .nxl-content .main-content { padding-top: 16px; }
}
@media (max-width: 575.98px) {
  .nxl-content .main-content { padding: 16px; }
  .y-ist-deger { font-size: 20px; }
  .y-hesap-bas > .d-flex { width: 100%; justify-content: space-between; }
}