/* =========================================================
   Buton Sistemi — V6 (Xpoda uyumlu, JS ikon enjeksiyonlu)
   Kullanım: bu dosyayı Xpoda Client\Content\custom\ içine,
   buttons.js'i de Xpoda Client\Scripts\custom\ içine koyun.
   Butonlara Studio "Custom Css" kutusundan class verin.
   Örnekler: ornek.html

   NOT:
   - Tüm özellikler `!important` (Xpoda inline + Kendo temasını ezmek için).
   - İkonlar CSS pseudo-element ile DEĞİL, buttons.js tarafından
     gerçek <svg> (.nct-ico) olarak eklenir. Sebep: Kendo butonu
     ::before/::after'ı kendi overlay'i için kullanıp ikonu siliyordu.
   ========================================================= */

:root {
  --btn-blue-600: #2563eb;
  --btn-blue-700: #1d4ed8;
  --btn-blue-50:  #eff6ff;
  --btn-red-600:  #dc2626;
  --btn-red-50:   #fef2f2;
  --btn-green-700: #107c41;
  --btn-green-800: #0b5c30;
  --btn-green-50:  #f0fdf4;
  --btn-slate-900: #0f172a;
  --btn-slate-700: #334155;
  --btn-slate-600: #475569;
  --btn-slate-500: #64748b;
  --btn-slate-400: #94a3b8;
  --btn-slate-300: #cbd5e1;
  --btn-slate-200: #e2e8f0;
  --btn-slate-100: #f1f5f9;
  --btn-slate-50:  #f8fafc;
  --btn-radius: 6px;
  --btn-height: 36px;
  --btn-font-size: 13.5px;
}

/* ---------- Temel buton ---------- */
.btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  height: var(--btn-height) !important;
  padding: 0 14px !important;
  border-radius: var(--btn-radius) !important;
  border: 1px solid transparent !important;
  background: transparent !important;
  font-family: inherit !important;
  font-size: var(--btn-font-size) !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  box-shadow: none !important;
  text-decoration: none !important;
  transition: background 0.13s ease, border-color 0.13s ease,
              color 0.13s ease, box-shadow 0.13s ease !important;
}
.btn:active { transform: translateY(0.5px) !important; }
.btn:focus-visible { outline: 2px solid var(--btn-blue-600) !important; outline-offset: 2px !important; }

/* ---------- Beyaz zemin temizliği ----------
   Sadece .btn-primary renkli zemin taşır. Diğer TÜM butonlar şeffaf
   durur — Kendo'nun varsayılan beyaz/gri zemini ve .btn-outline beyazı
   dahil. Böylece butonların arkasında beyaz kutu kalmaz; toolbar'a düz
   oturur, hover'da hafif zemin gelir. (.btn:not(.btn-primary) özgüllüğü
   varyantların idle hâlini ezer; hover kuralları sonra geldiği için
   hover zeminleri çalışmaya devam eder.) */
.btn:not(.btn-primary):not([class*="btn-outline"]):not(.btn-group *):not(.ico-copy):not(.ico-power):not(.ico-eye):not(.ico-save):not(.btn-save):not(.btn-save-green):not(.btn-excel):not(.btn-pdf) {
  background-color: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

/* Default inline SVG size inside buttons (like menu dots) */
.btn svg {
  width: 15px !important;
  height: 15px !important;
  display: inline-block !important;
  flex: none !important;
}

/* ---------- İkon (buttons.js .nct-ico olarak ekler) ----------
   Generic ikonlar (add/edit/delete) currentColor'ı izler → buton
   metin rengiyle aynı olur (mavi butonda beyaz, hover'da kırmızı...).
   Excel/PDF rengi SVG'ye gömülü (yeşil/kırmızı), buttons.js verir. */
.nct-ico {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: none !important;
  line-height: 0 !important;
  order: -1 !important;            /* her ihtimale karşı metnin solunda */
}
.nct-ico svg {
  width: 15px !important;
  height: 15px !important;
  display: block !important;
  fill: none !important;
  stroke-width: 2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

/* ---------- Varyantlar ---------- */

/* Birincil — sayfada tek olmalı (Ekle, Filtrele, Kaydet) */
.btn-primary { background: var(--btn-blue-600) !important; color: #fff !important; }
.btn-primary:hover { background: var(--btn-blue-700) !important; }

/* Sessiz — sık işlemler (Düzenle vb.) */
.btn-quiet { color: var(--btn-slate-600) !important; }
.btn-quiet:hover { background: var(--btn-slate-100) !important; color: var(--btn-slate-900) !important; }

/* Tehlikeli — Sil; nötr durur, hover'da kırmızılaşır (ikon da currentColor ile kırmızıya döner) */
.btn-danger { color: var(--btn-slate-600) !important; }
.btn-danger:hover { background: var(--btn-red-50) !important; color: var(--btn-red-600) !important; }

/* İkincil (outline) — İptal vb. */
.btn-outline { background: #fff !important; border-color: var(--btn-slate-300) !important; color: var(--btn-slate-700) !important; }
.btn-outline:hover { background: var(--btn-slate-50) !important; border-color: var(--btn-slate-400) !important; }

/* =========================================================
   Özel Renkli Araç Çubuğu Butonları (Görseldeki Gibi)
   ========================================================= */

/* Ekle (Yeşil) */
.btn-outline-green { color: #16a34a !important; border-color: #16a34a !important; background-color: #fff !important; }
.btn-outline-green:hover { background-color: #f0fdf4 !important; }

/* Düzenle (Mavi) */
.btn-outline-blue { color: #2563eb !important; border-color: #2563eb !important; background-color: #fff !important; }
.btn-outline-blue:hover { background-color: #eff6ff !important; }

/* İncele (Teal / Turkuaz) */
.btn-outline-teal { color: #0891b2 !important; border-color: #0891b2 !important; background-color: #fff !important; }
.btn-outline-teal:hover { background-color: #ecfeff !important; }

/* Kopyala (Mor) */
.btn-outline-purple { color: #9333ea !important; border-color: #9333ea !important; background-color: #fff !important; }
.btn-outline-purple:hover { background-color: #faf5ff !important; }

/* Aktif / Pasif (Turuncu/Kahve) */
.btn-outline-orange { color: #d97706 !important; border-color: #d97706 !important; background-color: #fff !important; }
.btn-outline-orange:hover { background-color: #fffbeb !important; }

/* Sil (Kırmızı) */
.btn-outline-red { color: #dc2626 !important; border-color: #dc2626 !important; background-color: #fff !important; }
.btn-outline-red:hover { background-color: #fef2f2 !important; }

/* Yenile (Gri Kenarlık, Koyu Metin) */
.btn-outline-slate { color: #334155 !important; border-color: #cbd5e1 !important; background-color: #fff !important; }
.btn-outline-slate:hover { background-color: #f8fafc !important; }

/* AI Tablo Analizi (Özel Mor Arka Planlı) */
.btn-ai { color: #7c3aed !important; border-color: #c4b5fd !important; background-color: #f5f3ff !important; }
.btn-ai:hover { background-color: #ede9fe !important; border-color: #a78bfa !important; }

/* Sadece ikon (metni gizler) */
.btn-icon {
  padding: 0 10px !important;
  font-size: 0 !important; /* İçindeki metni gizler, sadece ikon görünür */
}

/* Kaydet (Save) Butonu - Dolgulu Ana Aksiyon */
.btn-save {
  background-color: #2563eb !important;
  color: #fff !important;
  border-color: #2563eb !important;
  box-shadow: 0 2px 4px rgba(37, 99, 235, 0.2) !important;
  font-weight: 600 !important;
}
.btn-save:hover {
  background-color: #1d4ed8 !important;
  border-color: #1d4ed8 !important;
  box-shadow: 0 4px 6px rgba(37, 99, 235, 0.3) !important;
  color: #fff !important;
  transform: translateY(-0.5px) !important;
}

/* Kaydet (Save) Butonu - Dolgulu Yeşil Varyant */
.btn-save-green {
  background-color: #16a34a !important; /* Canlı yeşil */
  color: #fff !important;
  border-color: #16a34a !important;
  box-shadow: 0 2px 4px rgba(22, 163, 74, 0.2) !important;
  font-weight: 600 !important;
}
.btn-save-green:hover {
  background-color: #15803d !important;
  border-color: #15803d !important;
  box-shadow: 0 4px 6px rgba(22, 163, 74, 0.3) !important;
  color: #fff !important;
  transform: translateY(-0.5px) !important;
}

/* Kaydet (Save) - Outline İkon Kullanımı */
.btn:not(.btn-save):not(.btn-save-green):not([class*="btn-outline"]).ico-save {
  border-color: #2563eb !important;
  color: #2563eb !important;
  background-color: #fff !important;
}
.btn:not(.btn-save):not(.btn-save-green):not([class*="btn-outline"]).ico-save:hover {
  background-color: #eff6ff !important;
}

/* Özel İkon Hover Durumları */
.btn:not(.btn-primary).ico-eye {
  border-color: #0891b2 !important;
  color: #0891b2 !important;
  background-color: #fff !important;
}
.btn:not(.btn-primary).ico-eye:hover {
  background: var(--btn-blue-50) !important;
  border-color: var(--btn-blue-600) !important;
  color: var(--btn-blue-600) !important;
}

.btn:not(.btn-primary).ico-refresh:hover {
  background: var(--btn-green-50) !important;
  border-color: var(--btn-green-700) !important;
  color: var(--btn-green-700) !important;
}

.btn:not(.btn-primary).ico-delete {
  border-color: #dc2626 !important;
  color: #dc2626 !important;
  background-color: #fff !important;
}
.btn:not(.btn-primary).ico-delete:hover {
  background: var(--btn-red-50) !important;
  border-color: var(--btn-red-600) !important;
  color: var(--btn-red-600) !important;
}

.btn:not(.btn-primary).ico-copy {
  border-color: #9333ea !important;
  color: #9333ea !important;
  background-color: #fff !important;
}
.btn:not(.btn-primary).ico-copy:hover {
  background: #faf5ff !important;
}

.btn:not(.btn-primary).ico-power {
  border-color: #d97706 !important;
  color: #d97706 !important;
  background-color: #fff !important;
}
.btn:not(.btn-primary).ico-power:hover {
  background: #fffbeb !important;
}

/* Dışa aktarma butonları — ikonu buttons.js sabit renkle (yeşil/kırmızı) ekler */
.btn:not(.btn-primary).btn-excel {
  border-color: #16a34a !important;
  color: #16a34a !important;
  background-color: #fff !important;
}
.btn:not(.btn-primary).btn-excel:hover {
  background: var(--btn-green-50) !important;
  border-color: var(--btn-green-700) !important;
  color: var(--btn-green-800) !important;
}

.btn:not(.btn-primary).btn-pdf {
  border-color: #dc2626 !important;
  color: #dc2626 !important;
  background-color: #fff !important;
}
.btn:not(.btn-primary).btn-pdf:hover {
  background: var(--btn-red-50) !important;
  border-color: var(--btn-red-600) !important;
  color: var(--btn-red-800) !important;
}

/* ---------- Devre dışı ---------- */
.btn:disabled,
.btn.is-disabled {
  opacity: 0.45 !important;
  cursor: not-allowed !important;
}
.btn:disabled:hover,
.btn.is-disabled:hover {
  background: transparent !important;
  color: var(--btn-slate-600) !important;
}
.btn-outline:disabled:hover,
.btn-outline.is-disabled:hover { background: #fff !important; border-color: var(--btn-slate-300) !important; }
.btn-primary:disabled:hover,
.btn-primary.is-disabled:hover { background: var(--btn-blue-600) !important; color: #fff !important; }

/* ---------- Araç çubuğu yerleşimi ---------- */
.toolbar {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}
.toolbar .spacer { flex: 1 !important; }

/* Seçim sayacı rozeti */
.selection-count {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--btn-blue-700) !important;
  background: var(--btn-blue-50) !important;
  border-radius: 999px !important;
  padding: 4px 12px !important;
}

/* ---------- Taşma menüsü (⋯) ---------- */
.menu-anchor { position: relative !important; }
.menu {
  position: absolute !important;
  top: calc(var(--btn-height) + 6px) !important;
  right: 0 !important;
  width: 210px !important;
  background: #fff !important;
  border: 1px solid var(--btn-slate-200) !important;
  border-radius: 8px !important;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.12) !important;
  padding: 5px !important;
  z-index: 50 !important;
}
.menu-item {
  display: flex !important;
  align-items: center !important;
  gap: 9px !important;
  padding: 8px 10px !important;
  border-radius: 5px !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  color: var(--btn-slate-700) !important;
  cursor: pointer !important;
  background: none !important;
  border: none !important;
  width: 100% !important;
  font-family: inherit !important;
  text-align: left !important;
}
.menu-item:hover { background: var(--btn-slate-100) !important; }
.menu-item svg {
  width: 15px !important;
  height: 15px !important;
  flex: none !important;
  display: inline-block !important;
}
.menu-item svg path,
.menu-item svg rect,
.menu-item svg circle {
  stroke: currentColor !important;
  stroke-width: 2 !important;
  fill: none !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}
.menu-sep { height: 1px !important; background: var(--btn-slate-100) !important; margin: 5px 4px !important; }

/* ---------- Durum rozeti (Aktif / Pasif) ---------- */
.badge {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  padding: 3px 10px !important;
  border-radius: 999px !important;
}
.badge .dot { width: 6px !important; height: 6px !important; border-radius: 50% !important; }
.badge.badge-on  { background: #ecfdf5 !important; color: #047857 !important; }
.badge.badge-on  .dot { background: #10b981 !important; }
.badge.badge-off { background: var(--btn-slate-100) !important; color: var(--btn-slate-500) !important; }
.badge.badge-off .dot { background: var(--btn-slate-400) !important; }

/* ---------- Hizalama Yardımcısı ---------- */
/* Filtre butonlarını etiketli inputlarla dikey olarak hizalamak için (Xpoda absolute yerleşimde) */
.btn-filter-align {
  margin-top: 22px !important;
}

/* ---------- Button Group (BtnGroup) ---------- */
/* Xpoda içindeki dropdown buton gruplarını biçimlendirir */
.btn-group {
  position: relative !important;
  display: inline-flex !important;
  align-items: stretch !important;
  border-radius: var(--btn-radius) !important;
  overflow: visible !important;
}

/* Buton grubu içindeki butonların varsayılan beyaz/outline stili */
.btn-group > .btn,
.btn-group > .octopod-group-button {
  background-color: #fff !important;
  border: 1px solid var(--btn-slate-300) !important;
  color: var(--btn-slate-700) !important;
}

.btn-group > .btn:hover,
.btn-group > .octopod-group-button:hover {
  background-color: var(--btn-slate-50) !important;
  border-color: var(--btn-slate-400) !important;
  color: var(--btn-slate-900) !important;
}

/* Sol butonun sağ köşelerini sıfırla ve kenarlığını düzenle */
.btn-group > .btn:first-child,
.btn-group > .octopod-group-button:first-child {
  border-top-right-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
  border-right: none !important;
}

/* Sağdaki ok butonunun sol köşelerini sıfırla */
.btn-group > .btn:last-child,
.btn-group > .dropdown-toggle {
  border-top-left-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
  padding: 0 10px !important;
  min-width: unset !important;
}

/* Açılır menü ok işareti (caret) */
.btn-group .dropdown-toggle .caret {
  display: inline-block !important;
  width: 0 !important;
  height: 0 !important;
  margin-left: 2px !important;
  vertical-align: middle !important;
  border-top: 4px solid currentColor !important;
  border-right: 4px solid transparent !important;
  border-left: 4px solid transparent !important;
  content: "" !important;
}

/* Dropdown Menu tasarımı */
.btn-group .dropdown-menu {
  position: absolute !important;
  top: 100% !important;
  left: 0 !important;
  transform: none !important;
  z-index: 1000 !important;
  display: none !important;
  float: left !important;
  min-width: 160px !important;
  padding: 5px !important;
  margin: 2px 0 0 !important;
  list-style: none !important;
  background-color: #fff !important;
  border: 1px solid var(--btn-slate-200) !important;
  border-radius: 8px !important;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.12) !important;
}

/* Menü açıldığında */
:is(.btn-group.open, .btn-group.show, .btn-group[aria-expanded="true"]) .dropdown-menu {
  display: block !important;
}

.btn-group .dropdown-menu li {
  margin: 0 !important;
  padding: 0 !important;
}

.btn-group .dropdown-menu a,
.btn-group .dropdown-menu .menu-item {
  display: flex !important;
  align-items: center !important;
  gap: 9px !important;
  padding: 8px 10px !important;
  border-radius: 5px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: var(--btn-slate-700) !important;
  text-decoration: none !important;
  cursor: pointer !important;
  transition: background 0.1s ease !important;
}

.btn-group .dropdown-menu a:hover,
.btn-group .dropdown-menu .menu-item:hover {
  background-color: var(--btn-slate-100) !important;
  color: var(--btn-slate-900) !important;
}

/* Renkli Dropdown Menu İtemleri */
.btn-group .dropdown-menu a.ico-power, .btn-group .dropdown-menu .menu-item.ico-power { color: #d97706 !important; }
.btn-group .dropdown-menu a.ico-power:hover, .btn-group .dropdown-menu .menu-item.ico-power:hover { background-color: #fffbeb !important; color: #b45309 !important; }

.btn-group .dropdown-menu a.ico-delete, .btn-group .dropdown-menu .menu-item.ico-delete { color: #dc2626 !important; }
.btn-group .dropdown-menu a.ico-delete:hover, .btn-group .dropdown-menu .menu-item.ico-delete:hover { background-color: #fef2f2 !important; color: #b91c1c !important; }

.btn-group .dropdown-menu a.ico-copy, .btn-group .dropdown-menu .menu-item.ico-copy { color: #9333ea !important; }
.btn-group .dropdown-menu a.ico-copy:hover, .btn-group .dropdown-menu .menu-item.ico-copy:hover { background-color: #faf5ff !important; color: #7e22ce !important; }

.btn-group .dropdown-menu a.ico-eye, .btn-group .dropdown-menu .menu-item.ico-eye { color: #0891b2 !important; }
.btn-group .dropdown-menu a.ico-eye:hover, .btn-group .dropdown-menu .menu-item.ico-eye:hover { background-color: #ecfeff !important; color: #0369a1 !important; }

.btn-group .dropdown-menu a.ico-refresh, .btn-group .dropdown-menu .menu-item.ico-refresh { color: #16a34a !important; }
.btn-group .dropdown-menu a.ico-refresh:hover, .btn-group .dropdown-menu .menu-item.ico-refresh:hover { background-color: #f0fdf4 !important; color: #15803d !important; }

.btn-group .dropdown-menu a.btn-excel, .btn-group .dropdown-menu .menu-item.btn-excel { color: #16a34a !important; }
.btn-group .dropdown-menu a.btn-excel:hover, .btn-group .dropdown-menu .menu-item.btn-excel:hover { background-color: #f0fdf4 !important; color: #15803d !important; }

.btn-group .dropdown-menu a.btn-pdf, .btn-group .dropdown-menu .menu-item.btn-pdf { color: #dc2626 !important; }
.btn-group .dropdown-menu a.btn-pdf:hover, .btn-group .dropdown-menu .menu-item.btn-pdf:hover { background-color: #fef2f2 !important; color: #b91c1c !important; }

/* Eski ikonları gizleme yardımcısı (Custom SVG eklendiğinde) */
.nct-ico + i,
.nct-ico + .fa,
.nct-ico + .k-icon,
.nct-ico + .octopod-icon {
  display: none !important;
}

/* =========================================================
   View Toggle (Liste / Kanban Geçişi)
   ========================================================= */

.nct-view-toggle {
    display: inline-flex !important;
    background-color: #f1f5f9 !important;
    border-radius: 99px !important;
    padding: 3px !important;
    position: relative !important;
    user-select: none !important;
    border: 1px solid #e2e8f0 !important;
}

.nct-view-toggle input[type="radio"] {
    display: none !important;
}

.nct-view-toggle label {
    position: relative !important;
    z-index: 2 !important;
    padding: 5px 14px !important;
    font-family: 'Inter', 'Segoe UI', sans-serif !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    color: #64748b !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    transition: color 0.3s ease !important;
    border-radius: 99px !important;
    margin: 0 !important;
}

.nct-view-toggle label:hover {
    color: #334155 !important;
}

/* Aktif Durum Renkleri */
.nct-view-toggle input[type="radio"]:checked + label {
    color: #0f172a !important;
    font-weight: 500 !important; /* Jitter'ı önlemek için 600'den 500'e çekildi, kalınlaşma titremeye sebep olur */
    text-shadow: 0 0 .5px #0f172a !important; /* Kalınlaştırma yerine hafif gölge ile belirginleştirildi */
}

/* Sürüklenen (Hareketli) Arkaplan */
.nct-view-toggle::before {
    content: "" !important;
    position: absolute !important;
    top: 3px !important;
    bottom: 3px !important;
    left: 3px !important;
    width: calc(50% - 3px) !important;
    background-color: #ffffff !important;
    border-radius: 99px !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.08) !important;
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    z-index: 1 !important;
}

.nct-view-toggle:has(input[type="radio"]:nth-of-type(2):checked)::before {
    transform: translateX(100%) !important;
}

/* İkonlar için */
.nct-view-toggle svg {
    width: 15px !important;
    height: 15px !important;
    fill: currentColor !important;
    opacity: 0.7 !important;
    transition: opacity 0.3s !important;
}

.nct-view-toggle input[type="radio"]:checked + label svg {
    opacity: 1 !important;
    color: #2563eb !important;
}

/* Daha küçük versiyon ve Mobil Uyumluluk (Responsive) */
/* 1200px altı ekranlarda (Laptop) biraz daralt */
@media (max-width: 1200px) {
    .nct-view-toggle {
        padding: 2px !important;
    }
    .nct-view-toggle label {
        padding: 4px 8px !important;
        font-size: 11.5px !important;
        gap: 4px !important;
    }
    .nct-view-toggle svg {
        width: 13px !important;
        height: 13px !important;
    }
    .nct-view-toggle::before {
        top: 2px !important;
        bottom: 2px !important;
        left: 2px !important;
        width: calc(50% - 2px) !important;
    }
}

/* 768px altı ekranlarda (Tablet/Mobil) yazıları gizle sadece ikon kalsın! */
@media (max-width: 768px) {
    .nct-view-toggle label {
        font-size: 0 !important; /* Yazıyı gizle */
        padding: 6px 10px !important;
        gap: 0 !important;
    }
    .nct-view-toggle svg {
        width: 16px !important;
        height: 16px !important;
    }
}

/* Daha küçük versiyon */
.nct-view-toggle.sm label {
    padding: 4px 10px !important;
    font-size: 12.5px !important;
}
.nct-view-toggle.sm svg {
    width: 14px;
    height: 14px;
}

/* =========================================================
   Ayrı Liste ve Kanban Buton Tasarımları (Toggle İptal Edildiğinde)
   Kullanım: Xpoda'dan butonlara "nct-btn-list" veya "nct-btn-kanban" yazın.
   ========================================================= */

.nct-btn-list, .nct-btn-kanban {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    padding: 6px 14px !important;
    border-radius: 6px !important;
    font-family: 'Inter', 'Segoe UI', sans-serif !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    border: 1px solid transparent !important;
    box-sizing: border-box !important;
    height: 34px !important;
}

/* Liste Butonu Tasarımı (Sakin/Nötr) */
.nct-btn-list {
    background-color: #f8fafc !important;
    color: #475569 !important;
    border-color: #e2e8f0 !important;
}

.nct-btn-list:hover {
    background-color: #f1f5f9 !important;
    color: #0f172a !important;
    border-color: #cbd5e1 !important;
}

/* Kanban Butonu Tasarımı (Vurgulu/Mavi) */
.nct-btn-kanban {
    background-color: #eff6ff !important;
    color: #2563eb !important;
    border-color: #bfdbfe !important;
}

.nct-btn-kanban:hover {
    background-color: #dbeafe !important;
    color: #1d4ed8 !important;
    border-color: #93c5fd !important;
}

/* SVG boyutları */
.nct-btn-list svg, .nct-btn-kanban svg {
    width: 16px !important;
    height: 16px !important;
    fill: currentColor !important;
}

/* =========================================================
   �zel Hesaplama Butonlar� (Denizyolu Rate Kart)
   ========================================================= */

.btn-calc-main {
  background-color: #0284c7 !important;
  color: #fff !important;
  border-color: #0284c7 !important;
  border-radius: 0.75rem !important;
  padding: 0.875rem 2rem !important;
  height: auto !important;
  box-shadow: 0 10px 15px -3px rgba(2, 132, 199, 0.3) !important;
  font-weight: 700 !important;
  font-size: 1rem !important;
}
.btn-calc-main:hover {
  background-color: #0369a1 !important;
  border-color: #0369a1 !important;
  box-shadow: 0 10px 15px -3px rgba(2, 132, 199, 0.4) !important;
  transform: translateY(-1px) !important;
}

.btn-calc-engine {
  background-color: #0f172a !important;
  color: #fff !important;
  border-color: #0f172a !important;
  border-radius: 0.75rem !important;
  padding: 0.875rem 2rem !important;
  height: auto !important;
  box-shadow: 0 10px 15px -3px rgba(15, 23, 42, 0.3) !important;
  font-weight: 700 !important;
  font-size: 1rem !important;
}
.btn-calc-engine:hover {
  background-color: #000000 !important;
  border-color: #000000 !important;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.4) !important;
  transform: translateY(-1px) !important;
}


/* ========================================================================== */
/* FİNAL SADE & MODERN SCHEDULER CSS (REVİZE 3) */
/* ========================================================================== */

/* -------------------------------------------------------------------------- */
/* 1. GEREKSİZ BUTONLARI GİZLEME */
/* -------------------------------------------------------------------------- */
#Form_7_Sc_1 .k-scheduler-toolbar .k-view-agenda,
#Form_7_Sc_1 .k-scheduler-toolbar .k-view-workweek,
#Form_7_Sc_1 .k-scheduler-toolbar .k-view-timelineweek,
#Form_7_Sc_1 .k-scheduler-toolbar .k-view-timeline,
button[data-name="agenda"],
button[data-name="workWeek"],
button[data-name="timelineWeek"] {
    display: none !important;
}

/* -------------------------------------------------------------------------- */
/* 2. GENEL GÖRÜNÜM VE KONTEYNER */
/* -------------------------------------------------------------------------- */
#Form_7_Sc_1.k-scheduler {
    font-family: 'Segoe UI', Inter, -apple-system, BlinkMacSystemFont, sans-serif !important;
    background-color: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 12px !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.04) !important;
}

/* -------------------------------------------------------------------------- */
/* 3. TOOLBAR VE BUTONLAR */
/* -------------------------------------------------------------------------- */
#Form_7_Sc_1 .k-scheduler-toolbar {
    background-color: #ffffff !important;
    border-bottom: 1px solid #f0f0f0 !important;
    padding: 15px !important;
    border-radius: 12px 12px 0 0 !important;
}

#Form_7_Sc_1 .k-scheduler-toolbar .k-button {
    background-color: #fff !important;
    border: 1px solid #e0e0e0 !important;
    color: #4b5563 !important;
    border-radius: 8px !important;
    font-weight: 500 !important;
    box-shadow: none !important;
    transition: all 0.2s ease !important;
}

#Form_7_Sc_1 .k-scheduler-toolbar .k-button:hover {
    background-color: #f9fafb !important;
}

/* Aktif Sekme */
#Form_7_Sc_1 .k-scheduler-toolbar .k-button.k-state-selected,
#Form_7_Sc_1 .k-scheduler-toolbar .k-button.k-selected {
    background-color: #3b82f6 !important;
    color: #ffffff !important;
    border-color: #3b82f6 !important;
    font-weight: 600 !important;
    box-shadow: 0 4px 6px rgba(59, 130, 246, 0.3) !important;
}
/* ========================================================================== */
/* SADECE BAŞLIKLARI (NCT2 ve GÜNLER) İNCELTME */
/* ========================================================================== */

/* 1. NCT2 Yazan Üst Satır (Grup Başlığı) */
#Form_7_Sc_1 .k-scheduler-header th.k-scheduler-group-cell {
    height: 30px !important;       /* Yüksekliği sabitledik */
    padding: 0 !important;         /* İç boşluğu sildik */
    line-height: 30px !important;  /* Yazıyı ortaladık */
    vertical-align: middle !important;
}

/* 2. Günlerin Yazdığı Alt Satır (Pzt, Salı vb.) - GENEL */
#Form_7_Sc_1 .k-scheduler-header-wrap th {
    height: 30px !important;       
    padding: 0 !important;
    line-height: 30px !important;
    vertical-align: middle !important;
}

/* 3. AYLIK GÖRÜNÜM İÇİN ÖZEL DÜZELTME (Month View Fix) */
/* Aylık görünümde yapı biraz farklıdır, burayı özel olarak ezmemiz gerekir */
.k-scheduler-monthview .k-scheduler-header th {
    height: 30px !important;       
    line-height: 30px !important;  
    padding: 0 !important;         
    vertical-align: middle !important;
}

/* 4. Başlıkların içindeki Link ve Yazıların Boşluklarını Sıfırlama */
/* Kendo bazen th içine koyduğu span/link elementlerine de padding verir, onları siliyoruz */
#Form_7_Sc_1 .k-scheduler-header th .k-link,
#Form_7_Sc_1 .k-scheduler-header th span {
    padding: 0 !important;
    margin: 0 !important;
    display: inline-block !important; /* Blok gibi davranıp ortalansın */
    line-height: normal !important;   /* Satır yüksekliğini dış kutudan alsın */
    min-height: 0 !important;         /* Minimum yükseklik kuralını iptal et */
}
/* ========================================================================== */
/* AYLIK GÖRÜNÜM (MONTH VIEW) BAŞLIKLARINI ZORLA KÜÇÜLTME */
/* ========================================================================== */

/* 1. Aylık Görünümdeki Başlık Satırlarının Yüksekliğini Sabitle */
#Form_7_Sc_1 .k-scheduler-monthview .k-scheduler-header tr,
#Form_7_Sc_1 .k-scheduler-monthview .k-scheduler-header th {
    height: 30px !important;       /* Yüksekliği 30px'e kilitledik */
    line-height: 30px !important;  /* Yazıyı dikeyde ortaladık */
    padding: 0 !important;         /* İç boşlukları sıfırladık */
    vertical-align: middle !important;
}

/* 2. İçindeki Link ve Yazıların Boşluklarını Al */
/* Kendo bazen 'Pazartesi' yazısını bir link (a etiketi) içine koyar */
#Form_7_Sc_1 .k-scheduler-monthview .k-scheduler-header th .k-link,
#Form_7_Sc_1 .k-scheduler-monthview .k-scheduler-header th span {
    padding: 0 !important;
    margin: 0 !important;
    line-height: 30px !important; /* Dış kutuyla aynı hizaya getirdik */
    display: block !important;     /* Tam otursun diye blok yaptık */
    min-height: 0 !important;      /* Kendo'nun min-height kuralını ezdik */
}

/* 3. Gün İsimlerinin Olduğu Satırın Alt Çizgisini İncelt (Opsiyonel Estetik) */
#Form_7_Sc_1 .k-scheduler-monthview .k-scheduler-header th {
    border-bottom: 1px solid #e5e7eb !important;
}
/* -------------------------------------------------------------------------- */
/* 5. IZGARA (GRID) VE SATIR YÜKSEKLİKLERİ */
/* -------------------------------------------------------------------------- */
#Form_7_Sc_1 .k-scheduler-content {
    background-color: #fff !important;
    overflow-y: auto !important; 
}

#Form_7_Sc_1 .k-scheduler-table td, 
#Form_7_Sc_1 .k-scheduler-table th {
    border-color: #f3f4f6 !important;
}

/* Günlük/Haftalık Satır Yüksekliği */
#Form_7_Sc_1 .k-scheduler-dayview .k-scheduler-table tr,
#Form_7_Sc_1 .k-scheduler-weekview .k-scheduler-table tr {
    height: 70px !important;
}

/* --- AYLIK GÖRÜNÜM SATIR YÜKSEKLİĞİ (ARTIRILDI) --- */
/* Ziyaret kutuları büyüdüğü için satırı da 120px'den 140px'e çıkardık */
#Form_7_Sc_1 .k-scheduler-monthview .k-scheduler-table tr {
    height: 140px !important; 
}
#Form_7_Sc_1 .k-scheduler-monthview .k-scheduler-table td {
    height: 140px !important;
}

/* Seçili Hücre */
#Form_7_Sc_1 .k-scheduler-table td.k-state-selected,
#Form_7_Sc_1 .k-scheduler-table td.k-selected {
    background-color: #e5e7eb !important;
    background-image: none !important;
    border-color: #d1d5db !important;
}

#Form_7_Sc_1 .k-scheduler-table td:hover {
    background-color: #f3f4f6 !important;
}

/* -------------------------------------------------------------------------- */
/* 6. ETKİNLİK KUTUCUKLARI (EVENTS) - GÜNCELLENDİ */
/* -------------------------------------------------------------------------- */
#Form_7_Sc_1 .k-event {
    background-color: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-left: 4px solid #3b82f6 !important;
    color: #1f2937 !important;
    border-radius: 6px !important;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05) !important;
    padding: 6px 8px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    white-space: normal !important;
    line-height: 1.4 !important; /* Satır aralığı açıldı */
}

/* --- AYLIK GÖRÜNÜM İÇİN ÖZEL KUTU AYARI (BÜYÜTÜLDÜ) --- */
#Form_7_Sc_1 .k-scheduler-monthview .k-event {
    /* Yazıların okunması için yükseklik artırıldı */
    min-height: 65px !important; 
    height: auto !important;
}

#Form_7_Sc_1 .k-event div, 
#Form_7_Sc_1 .k-event p {
    background: transparent !important;
    color: inherit !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    margin: 0 !important;
}

/* -------------------------------------------------------------------------- */
/* 7. HAFTA SONLARINI KAPATMA */
/* -------------------------------------------------------------------------- */
.k-scheduler-monthview .k-scheduler-table td:nth-child(6),
.k-scheduler-monthview .k-scheduler-table td:nth-child(7),
.k-scheduler-weekview .k-scheduler-table td:nth-child(6),
.k-scheduler-weekview .k-scheduler-table td:nth-child(7) {
    pointer-events: none !important;
    user-select: none !important;
    background-color: #f1f5f9 !important;
    background-image: repeating-linear-gradient(
        45deg,
        #f1f5f9,
        #f1f5f9 10px,
        #e2e8f0 10px,
        #e2e8f0 20px
    ) !important;
}

.k-scheduler-monthview .k-scheduler-header th:nth-child(6),
.k-scheduler-monthview .k-scheduler-header th:nth-child(7),
.k-scheduler-weekview .k-scheduler-header th:nth-child(6),
.k-scheduler-weekview .k-scheduler-header th:nth-child(7) {
    background-color: #f1f5f9 !important;
    color: #94a3b8 !important;
}

.k-scheduler-monthview .k-scheduler-table td:nth-child(6) .k-event,
.k-scheduler-monthview .k-scheduler-table td:nth-child(7) .k-event,
.k-scheduler-weekview .k-scheduler-table td:nth-child(6) .k-event,
.k-scheduler-weekview .k-scheduler-table td:nth-child(7) .k-event {
    opacity: 0.5 !important;
    filter: grayscale(100%) !important;
}

/* ========================================================================== */
/* KESİN ÇÖZÜM: HAFTA SONU TIKLAMA ENGELİ */
/* ========================================================================== */

/* JS bu sınıfı eklediğinde çalışır */
#Form_7_Sc_1.weekend-disabled .k-scheduler-content, 
#Form_7_Sc_1.weekend-disabled .k-scheduler-dayview .k-scheduler-table,
#Form_7_Sc_1.weekend-disabled .k-scheduler-header-wrap {
    
    /* 1. FARE ETKİLEŞİMİNİ FİZİKSEL OLARAK KAPAT */
    pointer-events: none !important; 
    
    /* 2. GÖRSEL OLARAK KAPALI OLDUĞUNU GÖSTER */
    background-color: #e2e8f0 !important; /* Koyu gri */
    opacity: 0.6 !important; /* Hafif silikleştir */
    
    /* Çizgili Taralı Alan (İsteğe bağlı) */
    background-image: repeating-linear-gradient(
        45deg,
        #e2e8f0,
        #e2e8f0 10px,
        #cbd5e1 10px,
        #cbd5e1 20px
    ) !important;
}

/* Header başlığının da rengini değiştir ki belli olsun */
#Form_7_Sc_1.weekend-disabled .k-scheduler-header th {
    background-color: #e2e8f0 !important;
    color: #94a3b8 !important;
}

/* Hafta Sonu Kilidi - Kesin Çözüm */
#Form_7_Sc_1.weekend-locked .k-scheduler-content,
#Form_7_Sc_1.weekend-locked .k-scheduler-header-wrap {
    background-color: #e2e8f0 !important; /* Gri Zemin */
    background-image: repeating-linear-gradient(
        45deg,
        #e2e8f0,
        #e2e8f0 10px,
        #cbd5e1 10px,
        #cbd5e1 20px
    ) !important;
    pointer-events: none !important; /* Tıklamayı donanımsal olarak kapatır */
    opacity: 0.7 !important;
}

/* Header Rengini de Değiştir (Görsel uyarı için) */
#Form_7_Sc_1.weekend-locked .k-scheduler-header th {
    background-color: #cbd5e1 !important; 
    color: #64748b !important;
}

/* ========================================================================== */
/* NCT2 (GRUP BAŞLIĞI) SATIRINI TÜM GÖRÜNÜMLERDE YOK ETME */
/* ========================================================================== */

/* 1. SAĞ TARAF: "NCT2" Yazan İlk Satırı Gizle */
/* Günlük ve Haftalık görünüm için */
#Form_7_Sc_1 .k-scheduler-header table tr:first-child {
    display: none !important;
}

/* 2. SOL TARAF: Buna Karşılık Gelen Boşluğu da Gizle */
/* Bunu yapmazsak saatler aşağıda kalır, hizalama bozulur */
#Form_7_Sc_1 .k-scheduler-times table tr:first-child {
    display: none !important;
}

/* 3. AYLIK GÖRÜNÜM (Month View) İÇİN GARANTİ */
/* Aylık görünümde yapı bazen farklılaşabilir, onu da ayrıca hedefliyoruz */
#Form_7_Sc_1 .k-scheduler-monthview .k-scheduler-header table tr:first-child {
    display: none !important;
}

/* 4. EKSTRA GÜVENLİK: Eğer 'k-scheduler-group-cell' sınıfı varsa onu da gizle */
#Form_7_Sc_1 .k-scheduler-group-cell {
    display: none !important;
}

/* ========================================================================== */
/* AYLIK GÖRÜNÜM HEADER "EZİCİ" KODLARI */
/* ========================================================================== */

/* 1. SATIR (ROW) YÜKSEKLİĞİNİ ZORLA (Tablonun satırına kural koyuyoruz) */
#Form_7_Sc_1 .k-scheduler-monthview .k-scheduler-header table tr {
    height: 25px !important;      /* Satırı 25px'e kilitledik */
}

/* 2. HÜCRE (TH) YÜKSEKLİĞİ - (Daha spesifik bir seçici kullandık) */
/* th.k-scheduler-cell.k-heading-cell diyerek nokta atışı yapıyoruz */
#Form_7_Sc_1 .k-scheduler-monthview .k-scheduler-header th.k-scheduler-cell.k-heading-cell {
    height: 25px !important;
    line-height: 25px !important; /* Yazıyı dikey ortala */
    padding: 0 !important;        /* Tüm iç boşlukları sil */
    font-size: 12px !important;   /* Fontu küçült */
    vertical-align: middle !important;
    border-bottom: 1px solid #ddd !important; /* Alt çizgi netleşsin */
}

/* 3. İÇERİK (LINK) - EN ÖNEMLİ KISIM */
/* Kendo genellikle yazıyı bir <a> etiketi içine koyar ve padding verir. Bunu sıfırlamazsak kutu küçülmez. */
#Form_7_Sc_1 .k-scheduler-monthview .k-scheduler-header th .k-link,
#Form_7_Sc_1 .k-scheduler-monthview .k-scheduler-header th span {
    display: block !important;    /* Kutu gibi davran */
    height: 25px !important;      /* Yüksekliği dış kutuyla aynı yap */
    line-height: 25px !important; /* Yazıyı ortala */
    padding: 0 !important;        /* Linkin iç boşluğunu sil */
    margin: 0 !important;         /* Kenar boşluğunu sil */
    min-height: 0 !important;     /* Kendo'nun min-height korumasını kaldır */
}
/* PDF fontu i�in tanimlama */
@font-face {
    font-family: 'DejaVu Sans';
    src: url('https://kendo.cdn.telerik.com/2023.1.117/styles/fonts/DejaVu/DejaVuSans.ttf') format('truetype');
}

@font-face {
    font-family: 'DejaVu Sans';
    font-weight: bold;
    src: url('https://kendo.cdn.telerik.com/2023.1.117/styles/fonts/DejaVu/DejaVuSans-Bold.ttf') format('truetype');
}

.nct-btn-r {
  background-color: white !important;
    color: red !important;
    border: 2px solid red !important;
  border-radius:10px !important;
  margin-top:30px !important;
  box-shadow:-3px -1px 4px 0px #f00 !important;
  font-family: Arial, sans-serif !important;
}
.nct-btn-g {
  background-color: white !important;
  color: #04AA6D !important;
  border: 2px solid #04AA6D !important;
  border-radius:10px !important;
  margin-top:30px !important;
  box-shadow:-3px -1px 4px 0px #04AA6D !important;
  font-family: Arial, sans-serif !important;
}
.nct-btn-b {
  background-color: white !important;
  color: #1b53a3 !important;
  border: 2px solid #1b53a3 !important;
  border-radius:10px !important;
  margin-top:30px !important;
}

.nct-btn-f {
  background-color: white;
    color: #6082B6;
    border: 2px solid #6082B6;
  border-radius:10px;
  font-family: Arial, sans-serif;
}

.nct-h1{
  padding-left: 10px;
  border-radius: 10px;
  font-family: Arial, sans-serif;
}

.k-button-solid-base.nct-okr-btn
.k-button-solid-base.nct-okr-btn-r,
.k-button-solid-base.nct-okr-btn-g,
.k-button-solid-base.nct-okr-btn-b,
.k-button-solid-base.nct-okr-btn-f {
  font-size: 12px !important;
  border-radius:50px;
  color:#222d65;
  font-family: Arial, sans-serif;
}
.k-button-solid-base.nct-okr-btn {
  background-color: #ffffff90;
  background-repeat: no-repeat;
  background-size: 50%;
  background-position: center;
  position: fixed;
  bottom: 25px;
  right: 25px;
  width: 50px !important;
  height: 50px !important;
  border-radius: 125px;
  z-index: 999;
  cursor: pointer;
  font-size: 25px !important;
  line-height: 25px;
  padding: 0 10px !important; 
  border-right: 3px solid #2980b9;
  border-bottom: 4px solid #2980b9;
  border-left: 1px solid #3498db;
  border-top: 1px solid #3498db;
  font-family: Arial, sans-serif;
}
.k-button-solid-base.nct-okr-btn:hover {
  border-right: 1px solid #2980b9;
  border-bottom: 2px solid #2980b9;
  border-left: 1px solid #3498db;
  border-top: 1px solid #3498db;
  font-family: Arial, sans-serif;
}
.k-button-solid-base.nct-okr-btn-1 {
  right: 25px;
 font-family: Arial, sans-serif;
}
.k-button-solid-base.nct-okr-btn-2 {
  right: 75px;
 font-family: Arial, sans-serif;
}
.k-button-solid-base.nct-okr-btn-3 {
  right: 125px;
 font-family: Arial, sans-serif;
}
.k-button-solid-base.nct-okr-btn-4 {
  right: 175px;
 font-family: Arial, sans-serif;
}
.k-button-solid-base.nct-okr-btn-5 {
  right: 225px;
 font-family: Arial, sans-serif;
}
.k-button-solid-base.nct-okr-btn-save {
  background-image: url("https://cdn2.iconfinder.com/data/icons/leto-most-searched-mix-4/64/__download_save_diskette-512.png");
}
.k-button-solid-base.nct-okr-btn-delete {
  background-image: url("https://cdn0.iconfinder.com/data/icons/leto-most-searched-mix-2/64/_delete_trash-512.png");
}
.k-button-solid-base.nct-okr-btn-new {
  background-image: url("https://cdn0.iconfinder.com/data/icons/leto-most-searched-mix-2/64/_add_plus_new-512.png");
}
.k-button-solid-base.nct-okr-btn-schema {
  background-image: url("https://cdn0.iconfinder.com/data/icons/leto-blue-project-management/64/_-21-512.png");
}

.k-button-solid-base.nct-okr-btn-bring {
  background-image: url("https://cdn3.iconfinder.com/data/icons/leto-editing-tools/64/__clone_copy_bottom_object_layer-512.png");


}

.k-button-solid-base.nct-okr-btn-edit {
  background-image: url("https://cdn2.iconfinder.com/data/icons/leto-most-searched-mix-6/64/__column_data_edit-512.png");
}

.k-button-solid-base.nct-okr-btn-copy {
  background-image: url("https://cdn3.iconfinder.com/data/icons/leto-editing-tools/64/__layers_copy_objects_swap-512.png");
}

.k-button-solid-base.nct-okr-btn-refresh {
  background-image: url("https://cdn2.iconfinder.com/data/icons/leto-blue-big-data/64/big_data-14-512.png");
}

.k-button-solid-base.nct-okr-btn-value{
  background-image: url("https://cdn0.iconfinder.com/data/icons/leto-survey-rating/64/__choice_hand_select_checkmark-512.png");
}
.k-button-solid-base.nct-okr-btn-target{
  background-image: url("https://cdn1.iconfinder.com/data/icons/leto-ads-marketing/64/__target_audience_targetting_market-1024.png");
}
.nct-okr-text {
  border-radius: 50px !important;
  font-family: Arial, sans-serif;
}
.nct-okr-textmulti {
  border-radius: 20px !important;
  font-family: Arial, sans-serif;
}
.nct-okr-numeric {
  border-radius: 50px !important;
  font-family: Arial, sans-serif;
}
.nct-okr-label {
  text-shadow: 1px 1px 2px #ccc;
  font-family: Arial, sans-serif;
}
.k-combobox.nct-okr-dropdown {
  height: 30px !important;
  border-radius: 50px !important;
  box-shadow: 2px 2px 2px #ccc;
  font-family: Arial, sans-serif;
}

.nct-h1-okr, .nct-h2-okr, .nct-h3-okr, .nct-h4-okr {
  background-color: #fff !important;
  background-image: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,.02), rgba(0,0,0,.05)) !important;
  color:#222d65  !important;
  border-left: 10px solid #222d65;
  border-bottom: 1px solid #222d65;
  border-radius:20px;
  font-family: Tahoma !important;
  font-weight:bold !important;
  text-align:left !important;
  height:30px !important;
  line-height:30px !important;
  padding:0;
  margin:0;
  padding-left: 10px;
  font-family: Arial, sans-serif;
}

.nct-h1-okr {
  font-size:20px !important;
  color: #222d65 !important;
  border-left: 10px solid #222d65;
  border-bottom: 1px solid #222d65;
  font-family: Arial, sans-serif;
}
.nct-h2-okr {
  font-size:16px !important;
  color: #222d65 !important;
  border-left: 10px solid #222d65;
  border-bottom: 1px solid #222d65;
  font-family: Arial, sans-serif;
}
.nct-h3-okr {
  font-size:14px !important;
  color:#222d65 !important;
  border-left: 10px solid #222d65;
  border-bottom: 1px solid #222d65;
  font-family: Arial, sans-serif;
}
.nct-h4-okr {
  font-size:13px !important;
  color: #222d65 !important;
  border-left: 10px solid #222d65;
  border-bottom: 1px solid #222d65;
  font-family: Arial, sans-serif;
}


 
/* =========================================================
   DateTime (Kendo DateTimePicker / DatePicker / TimePicker)
   — Xpoda Tasarımı
   Tarih & saat seçici alanları. Textbox, Dropdown ve buton
   sistemiyle aynı palet ve ölçüler.
   Bu dosyayı Xpoda'ya ekleyin; mevcut DateTimePicker markup'ı
   (span.k-datetimepicker) ve açılan takvim/saat popup'ı
   otomatik olarak bu tasarımı alır.

   NOT: Xpoda HTML'ine müdahale edilemediği için tüm özellikler
   !important ile verilir — Kendo teması ve inline stiller ezilir.
   Örnekler: datetime.html
   ========================================================= */

:root {
  --dt-blue-600: #2563eb;
  --dt-blue-700: #1d4ed8;
  --dt-blue-100: #dbeafe;
  --dt-blue-50:  #eff6ff;
  --dt-slate-900: #0f172a;
  --dt-slate-700: #334155;
  --dt-slate-600: #475569;
  --dt-slate-500: #64748b;
  --dt-slate-400: #94a3b8;
  --dt-slate-300: #cbd5e1;
  --dt-slate-200: #e2e8f0;
  --dt-slate-100: #f1f5f9;
  --dt-slate-50:  #f8fafc;
  --dt-radius: 6px;
  --dt-height: 36px;
  --dt-font-size: 12.5px;
}

/* ---------- Giriş kutusu (kapalı durum) ---------- */
span.k-input:is(.k-datetimepicker, .k-datepicker, .k-timepicker) {
  height: var(--dt-height) !important;
  border: 1px solid var(--dt-slate-300) !important;
  border-radius: var(--dt-radius) !important;
  background: #fff !important;
  box-shadow: none !important;
  display: inline-flex !important;
  align-items: stretch !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
  transition: border-color 0.13s ease, box-shadow 0.13s ease !important;
}
span.k-input:is(.k-datetimepicker, .k-datepicker, .k-timepicker):hover {
  border-color: var(--dt-slate-400) !important;
}
span.k-input:is(.k-datetimepicker, .k-datepicker, .k-timepicker):focus-within {
  border-color: var(--dt-blue-600) !important;
  box-shadow: 0 0 0 3px var(--dt-blue-100) !important;
}

/* ---------- İç Input Alanı ---------- */
:is(.k-datetimepicker, .k-datepicker, .k-timepicker) .k-input-inner {
  border: none !important;
  outline: none !important;
  background: transparent !important;
  padding: 0 12px !important;
  font-family: inherit !important;
  font-size: var(--dt-font-size) !important;
  color: var(--dt-slate-700) !important;
  min-width: 0 !important;
  flex: 1 !important;
  height: 100% !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
}
:is(.k-datetimepicker, .k-datepicker, .k-timepicker) .k-input-inner::placeholder {
  color: var(--dt-slate-400) !important;
}

/* ---------- Takvim / Saat tetikleyici butonları ---------- */
:is(.k-datetimepicker, .k-datepicker, .k-timepicker) .k-input-button {
  border: none !important;
  border-left: 1px solid var(--dt-slate-200) !important;
  background: transparent !important;
  padding: 0 9px !important;
  min-width: 0 !important;
  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  color: var(--dt-slate-500) !important;
  transition: background 0.13s ease, color 0.13s ease !important;
}
:is(.k-datetimepicker, .k-datepicker, .k-timepicker) .k-input-button:hover {
  background: var(--dt-slate-100) !important;
  color: var(--dt-slate-900) !important;
}
:is(.k-datetimepicker, .k-datepicker, .k-timepicker) .k-input-button:active {
  background: var(--dt-blue-50) !important;
  color: var(--dt-blue-700) !important;
}
:is(.k-datetimepicker, .k-datepicker, .k-timepicker) .k-input-button .k-icon svg,
:is(.k-datetimepicker, .k-datepicker, .k-timepicker) .k-input-button svg {
  width: 14px !important;
  height: 14px !important;
  display: block !important;
  fill: currentColor !important;
}

/* ---------- Devre dışı ---------- */
span.k-input:is(.k-datetimepicker, .k-datepicker, .k-timepicker).k-disabled,
span.k-input:is(.k-datetimepicker, .k-datepicker, .k-timepicker)[aria-disabled="true"] {
  opacity: 0.55 !important;
  background: var(--dt-slate-50) !important;
  cursor: not-allowed !important;
}
span.k-input:is(.k-datetimepicker, .k-datepicker, .k-timepicker).k-disabled .k-input-inner,
span.k-input:is(.k-datetimepicker, .k-datepicker, .k-timepicker).k-disabled .k-input-button {
  cursor: not-allowed !important;
}

/* =========================================================
   Açılır popup (takvim + saat)
   Kendo popup'ı body altına .k-animation-container içine
   render eder; bu yüzden seçiciler global yazılır.
   ========================================================= */
.k-animation-container :is(.k-popup, .k-datetime-container, .k-calendar-container, .k-timeselector) {
  border: 1px solid var(--dt-slate-200) !important;
  border-radius: 8px !important;
  background: #fff !important;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.12) !important;
  /* overflow: hidden !important; Alt menülerin (örn. Kendo Context Menu) taşmasını engellediği için kapatıldı. */
  font-size: var(--dt-font-size) !important;
}

/* ---------- Takvim ---------- */
.k-calendar {
  border: none !important;
  background: transparent !important;
  padding: 6px !important;
  font-size: var(--dt-font-size) !important;
}

/* Üst başlık (ay/yıl + ileri/geri okları) */
.k-calendar .k-calendar-header,
.k-calendar .k-header {
  padding: 4px 4px 6px !important;
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
}
.k-calendar .k-calendar-title,
.k-calendar .k-nav-fast {
  font-weight: 600 !important;
  color: var(--dt-slate-900) !important;
  background: transparent !important;
  border: none !important;
  border-radius: 5px !important;
  cursor: pointer !important;
  padding: 4px 8px !important;
}
.k-calendar .k-calendar-title:hover,
.k-calendar .k-nav-fast:hover { background: var(--dt-slate-100) !important; }
.k-calendar .k-calendar-nav-prev,
.k-calendar .k-calendar-nav-next,
.k-calendar .k-nav-prev,
.k-calendar .k-nav-next {
  background: transparent !important;
  border: none !important;
  border-radius: 5px !important;
  color: var(--dt-slate-600) !important;
  cursor: pointer !important;
}
.k-calendar .k-calendar-nav-prev:hover,
.k-calendar .k-calendar-nav-next:hover,
.k-calendar .k-nav-prev:hover,
.k-calendar .k-nav-next:hover { background: var(--dt-slate-100) !important; color: var(--dt-slate-900) !important; }

/* Gün başlıkları (Pt, Sa, ...) */
.k-calendar .k-calendar-weekdays th,
.k-calendar thead th {
  font-weight: 600 !important;
  color: var(--dt-slate-400) !important;
  font-size: 11px !important;
  padding: 4px 0 !important;
}

/* Gün hücreleri */
.k-calendar .k-calendar-td .k-link,
.k-calendar td .k-link {
  border-radius: 6px !important;
  color: var(--dt-slate-700) !important;
  font-size: var(--dt-font-size) !important;
  transition: background 0.1s ease, color 0.1s ease !important;
}
.k-calendar .k-calendar-td:hover .k-link,
.k-calendar td:hover .k-link,
.k-calendar .k-calendar-td.k-hover .k-link {
  background: var(--dt-slate-100) !important;
  color: var(--dt-slate-900) !important;
}
/* Bugün */
.k-calendar .k-today .k-link,
.k-calendar .k-calendar-td.k-today .k-link {
  color: var(--dt-blue-700) !important;
  box-shadow: inset 0 0 0 1px var(--dt-blue-100) !important;
}
/* Seçili gün */
.k-calendar .k-selected .k-link,
.k-calendar .k-calendar-td.k-selected .k-link,
.k-calendar .k-state-selected .k-link {
  background: var(--dt-blue-600) !important;
  color: #fff !important;
  box-shadow: none !important;
}
.k-calendar .k-selected:hover .k-link { background: var(--dt-blue-700) !important; }
/* Ay/diğer aya ait soluk günler */
.k-calendar .k-other-month .k-link,
.k-calendar .k-out-of-range .k-link { color: var(--dt-slate-400) !important; }

/* ---------- Saat listesi ---------- */
.k-timeselector .k-time-header,
.k-time-container .k-time-header {
  font-weight: 600 !important;
  color: var(--dt-slate-900) !important;
  padding: 6px 10px !important;
}
.k-time-list .k-item,
.k-time-container .k-item,
.k-time-list-wrapper .k-item {
  font-size: var(--dt-font-size) !important;
  color: var(--dt-slate-700) !important;
  border-radius: 5px !important;
  cursor: pointer !important;
  transition: background 0.1s ease !important;
}
.k-time-list .k-item:hover,
.k-time-container .k-item:hover { background: var(--dt-slate-100) !important; color: var(--dt-slate-900) !important; }
.k-time-list .k-item.k-selected,
.k-time-container .k-item.k-selected,
.k-time-list .k-item.k-state-selected {
  background: var(--dt-blue-50) !important;
  color: var(--dt-blue-700) !important;
  font-weight: 600 !important;
}

/* ---------- Alt buton grubu (Bugün / Ayarla / İptal) ---------- */
.k-datetime-footer,
.k-calendar-footer,
.k-datetime-buttongroup {
  display: flex !important;
  gap: 8px !important;
  padding: 8px !important;
  border-top: 1px solid var(--dt-slate-100) !important;
}
:is(.k-datetime-footer, .k-calendar-footer, .k-datetime-buttongroup) .k-button,
.k-calendar .k-calendar-footer .k-button,
.k-calendar .k-footer .k-nav-today {
  border-radius: var(--dt-radius) !important;
  font-size: var(--dt-font-size) !important;
  font-weight: 600 !important;
  padding: 6px 12px !important;
  cursor: pointer !important;
  box-shadow: none !important;
}
/* İkincil (İptal / Bugün) */
:is(.k-datetime-footer, .k-calendar-footer, .k-datetime-buttongroup) .k-button {
  background: #fff !important;
  border: 1px solid var(--dt-slate-300) !important;
  color: var(--dt-slate-700) !important;
}
:is(.k-datetime-footer, .k-calendar-footer, .k-datetime-buttongroup) .k-button:hover {
  background: var(--dt-slate-50) !important;
  border-color: var(--dt-slate-400) !important;
}
/* Birincil (Ayarla / Set) */
:is(.k-datetime-footer, .k-calendar-footer, .k-datetime-buttongroup) .k-button.k-primary,
:is(.k-datetime-footer, .k-calendar-footer, .k-datetime-buttongroup) .k-button.k-button-solid-primary {
  background: var(--dt-blue-600) !important;
  border-color: var(--dt-blue-600) !important;
  color: #fff !important;
}
:is(.k-datetime-footer, .k-calendar-footer, .k-datetime-buttongroup) .k-button.k-primary:hover,
:is(.k-datetime-footer, .k-calendar-footer, .k-datetime-buttongroup) .k-button.k-button-solid-primary:hover {
  background: var(--dt-blue-700) !important;
  border-color: var(--dt-blue-700) !important;
}

/* =========================================================
   Dropdown (Kendo ComboBox) — Xpoda Tasarımı
   Buton sistemiyle (Buttons/buttons.css) aynı palet ve
   ölçüler kullanılır. Bu dosyayı Xpoda'ya ekleyin;
   mevcut ComboBox markup'ı otomatik olarak etkilenir.

   NOT: Xpoda HTML'ine müdahale edilemediği için tüm
   özellikler !important ile verilir — Kendo teması ve
   inline stiller bu sayede ezilir.
   Örnekler: dropdown.html
   ========================================================= */

:root {
  --dd-blue-600: #2563eb;
  --dd-blue-700: #1d4ed8;
  --dd-blue-100: #dbeafe;
  --dd-blue-50:  #eff6ff;
  --dd-slate-900: #0f172a;
  --dd-slate-700: #334155;
  --dd-slate-600: #475569;
  --dd-slate-500: #64748b;
  --dd-slate-400: #94a3b8;
  --dd-slate-300: #cbd5e1;
  --dd-slate-200: #e2e8f0;
  --dd-slate-100: #f1f5f9;
  --dd-slate-50:  #f8fafc;
  --dd-radius: 6px;
  --dd-height: 36px;
  --dd-font-size: 12.5px;
}

/* ---------- Giriş kutusu (kapalı durum) ---------- */
span.k-input:is(.k-combobox, .k-dropdownlist, .k-dropdown, .k-autocomplete, .k-multiselect) {
  height: var(--dd-height) !important;
  border: 1px solid var(--dd-slate-300) !important;
  border-radius: var(--dd-radius) !important;
  background: #fff !important;
  box-shadow: none !important;
  display: inline-flex !important;
  align-items: stretch !important;
  overflow: hidden !important;
  transition: border-color 0.13s ease, box-shadow 0.13s ease !important;
}
span.k-input:is(.k-combobox, .k-dropdownlist, .k-dropdown, .k-autocomplete, .k-multiselect):hover {
  border-color: var(--dd-slate-400) !important;
}
span.k-input:is(.k-combobox, .k-dropdownlist, .k-dropdown, .k-autocomplete, .k-multiselect):focus-within {
  border-color: var(--dd-blue-600) !important;
  box-shadow: 0 0 0 3px var(--dd-blue-100) !important;
}

:is(.k-combobox, .k-dropdownlist, .k-dropdown, .k-autocomplete, .k-multiselect) .k-input-inner {
  border: none !important;
  outline: none !important;
  background: transparent !important;
  padding: 0 12px !important;
  font-family: inherit !important;
  font-size: var(--dd-font-size) !important;
  color: var(--dd-slate-700) !important;
  min-width: 0 !important;
  flex: 1 !important;
  box-shadow: none !important;
}
:is(.k-combobox, .k-dropdownlist, .k-dropdown, .k-autocomplete, .k-multiselect) .k-input-inner::placeholder {
  color: var(--dd-slate-400) !important;
}

/* ---------- Açılır ok butonu ---------- */
:is(.k-combobox, .k-dropdownlist, .k-dropdown, .k-autocomplete, .k-multiselect) .k-input-button {
  border: none !important;
  background: transparent !important;
  padding: 0 9px !important;
  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
  box-shadow: none !important;
  transition: background 0.13s ease !important;
}
:is(.k-combobox, .k-dropdownlist, .k-dropdown, .k-autocomplete, .k-multiselect) .k-input-button:hover {
  background: var(--dd-slate-100) !important;
}
:is(.k-combobox, .k-dropdownlist, .k-dropdown, .k-autocomplete, .k-multiselect) .k-input-button .k-icon svg,
:is(.k-combobox, .k-dropdownlist, .k-dropdown, .k-autocomplete, .k-multiselect) .k-input-button svg {
  width: 12px !important;
  height: 12px !important;
  fill: var(--dd-slate-500) !important;
  transition: transform 0.15s ease, fill 0.13s ease !important;
}
/* Açıkken / odaktayken ok maviye boyanır */
span.k-input:is(.k-combobox, .k-dropdownlist, .k-dropdown, .k-autocomplete, .k-multiselect):focus-within .k-input-button svg,
span.k-input:is(.k-combobox, .k-dropdownlist, .k-dropdown, .k-autocomplete, .k-multiselect)[aria-expanded="true"] .k-input-button svg {
  fill: var(--dd-blue-600) !important;
}

/* ---------- Temizle (x) ikonu ---------- */
:is(.k-combobox, .k-dropdownlist, .k-dropdown, .k-autocomplete, .k-multiselect) .k-clear-value {
  display: inline-flex !important;
  align-items: center !important;
  padding: 0 4px !important;
  cursor: pointer !important;
  opacity: 0.55 !important;
  transition: opacity 0.13s ease !important;
}
:is(.k-combobox, .k-dropdownlist, .k-dropdown, .k-autocomplete, .k-multiselect) .k-clear-value:hover { opacity: 1 !important; }
:is(.k-combobox, .k-dropdownlist, .k-dropdown, .k-autocomplete, .k-multiselect) .k-clear-value svg {
  width: 11px !important;
  height: 11px !important;
  fill: var(--dd-slate-500) !important;
}
:is(.k-combobox, .k-dropdownlist, .k-dropdown, .k-autocomplete, .k-multiselect) .k-clear-value.k-hidden { display: none !important; }

/* ---------- Devre dışı ---------- */
span.k-input:is(.k-combobox, .k-dropdownlist, .k-dropdown, .k-autocomplete, .k-multiselect).k-disabled,
span.k-input:is(.k-combobox, .k-dropdownlist, .k-dropdown, .k-autocomplete, .k-multiselect)[aria-disabled="true"] {
  opacity: 0.55 !important;
  background: var(--dd-slate-50) !important;
  cursor: not-allowed !important;
}
span.k-input:is(.k-combobox, .k-dropdownlist, .k-dropdown, .k-autocomplete, .k-multiselect).k-disabled .k-input-inner {
  cursor: not-allowed !important;
}

/* =========================================================
   Açılır liste (popup)
   Kendo popup'ı body altına .k-animation-container içine
   render eder; bu yüzden seçiciler global yazılır.
   ========================================================= */
.k-animation-container .k-popup,
.k-animation-container .k-list-container {
  border: 1px solid var(--dd-slate-200) !important;
  border-radius: 8px !important;
  background: #fff !important;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.12) !important;
  overflow: hidden !important;
}

.k-list-container .k-list {
  font-size: var(--dd-font-size) !important;
}

.k-list-ul {
  list-style: none !important;
  margin: 0 !important;
  padding: 5px !important;
}

.k-list-item {
  display: flex !important;
  align-items: center !important;
  padding: 8px 10px !important;
  border-radius: 5px !important;
  font-size: var(--dd-font-size) !important;
  font-weight: 500 !important;
  color: var(--dd-slate-700) !important;
  cursor: pointer !important;
  background: none !important;
  box-shadow: none !important;
  transition: background 0.1s ease !important;
}
.k-list-item:hover,
.k-list-item.k-hover {
  background: var(--dd-slate-100) !important;
  color: var(--dd-slate-900) !important;
}
.k-list-item.k-selected {
  background: var(--dd-blue-50) !important;
  color: var(--dd-blue-700) !important;
}
.k-list-item.k-selected:hover,
.k-list-item.k-selected.k-hover {
  background: var(--dd-blue-100) !important;
}
.k-list-item .k-list-item-text {
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* Arama eşleşme vurgusu (filter: contains) */
.k-list-item .k-list-item-text strong,
.k-list-item .k-highlight {
  color: var(--dd-blue-700) !important;
  font-weight: 700 !important;
  background: transparent !important;
}

/* Sonuç yok mesajı */
.k-list-container .k-nodata,
.k-no-data {
  padding: 14px 12px !important;
  font-size: var(--dd-font-size) !important;
  color: var(--dd-slate-400) !important;
  text-align: center !important;
}

/* =========================================================
   FigureBox (Kendo NumericTextBox) — Xpoda Tasarımı
   Sayısal giriş alanları (spin / artır-azalt oklu).
   Textbox & buton sistemiyle aynı palet ve ölçüler.
   Bu dosyayı Xpoda'ya ekleyin; mevcut NumericTextBox markup'ı
   (span.k-numerictextbox) otomatik olarak bu tasarımı alır.
   ========================================================= */

:root {
  --fb-blue-600: #2563eb;
  --fb-blue-700: #1d4ed8;
  --fb-blue-100: #dbeafe;
  --fb-blue-50:  #eff6ff;
  --fb-red-500:  #ef4444;
  --fb-red-100:  #fee2e2;
  --fb-slate-900: #0f172a;
  --fb-slate-700: #334155;
  --fb-slate-600: #475569;
  --fb-slate-500: #64748b;
  --fb-slate-400: #94a3b8;
  --fb-slate-300: #cbd5e1;
  --fb-slate-200: #e2e8f0;
  --fb-slate-100: #f1f5f9;
  --fb-slate-50:  #f8fafc;
  --fb-radius: 6px;
  --fb-height: 36px;
  --fb-font-size: 12.5px;
}

/* ---------- Kapsayıcı (sayısal kutu) ---------- */
span.k-input.k-numerictextbox {
  height: var(--fb-height) !important;
  border: 1px solid var(--fb-slate-300) !important;
  border-radius: var(--fb-radius) !important;
  background: #fff !important;
  box-shadow: none !important;
  display: inline-flex !important;
  align-items: stretch !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
  transition: border-color 0.13s ease, box-shadow 0.13s ease !important;
}

span.k-input.k-numerictextbox:hover {
  border-color: var(--fb-slate-400) !important;
}

span.k-input.k-numerictextbox:focus-within {
  border-color: var(--fb-blue-600) !important;
  box-shadow: 0 0 0 3px var(--fb-blue-100) !important;
}

/* ---------- İç Input Alanı ---------- */
.k-numerictextbox .k-input-inner {
  border: none !important;
  outline: none !important;
  background: transparent !important;
  padding: 0 12px !important;
  font-family: inherit !important;
  font-size: var(--fb-font-size) !important;
  color: var(--fb-slate-700) !important;
  min-width: 0 !important;
  flex: 1 !important;
  height: 100% !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
}

.k-numerictextbox .k-input-inner::placeholder {
  color: var(--fb-slate-400) !important;
}

/* ---------- Spin (Artır / Azalt) Sütunu ----------
   ÖNEMLİ: Spinner'ın YERLEŞİMİ ve GÖRÜNÜRLÜĞÜ Kendo'da bırakılır.
   Studio'dan spin butonlarını kapatırsanız (spinners: false) Kendo
   onları gizler/oluşturmaz; bu dosya display'i !important ile
   ZORLAMAZ — yoksa kapalı spinner geri görünür hâle gelirdi.
   Burada SADECE renk / kenarlık / ikon boyutu ezilir. */
.k-numerictextbox .k-input-spinner.k-spin-button {
  border-left: 1px solid var(--fb-slate-200) !important;
  background: transparent !important;
}

/* Tek tek ok butonları — Kendo'nun gri zeminini/temasını ez (yalnız görünüm) */
.k-numerictextbox .k-spin-button > .k-button {
  border: none !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--fb-slate-500) !important;
  box-shadow: none !important;
  cursor: pointer !important;
  transition: background 0.12s ease, color 0.12s ease !important;
}

/* İki ok arasına ince ayraç */
.k-numerictextbox .k-spin-button > .k-button.k-spinner-increase {
  border-bottom: 1px solid var(--fb-slate-200) !important;
}

.k-numerictextbox .k-spin-button > .k-button:hover {
  background: var(--fb-slate-100) !important;
  color: var(--fb-slate-900) !important;
}

.k-numerictextbox .k-spin-button > .k-button:active {
  background: var(--fb-blue-50) !important;
  color: var(--fb-blue-700) !important;
}

/* Ok ikonları (Kendo SVG caret) */
.k-numerictextbox .k-spin-button .k-svg-icon svg {
  width: 12px !important;
  height: 12px !important;
  fill: currentColor !important;
}

/* Spinner Studio'dan kapatıldıysa (gizli) — asla zorla gösterme */
.k-numerictextbox .k-input-spinner.k-hidden,
.k-numerictextbox .k-input-spinner[style*="display: none"],
.k-numerictextbox .k-input-spinner[style*="display:none"] { display: none !important; }

/* ---------- Doğrulama (geçersiz değer) ---------- */
.k-numerictextbox .k-input-validation-icon {
  color: var(--fb-red-500) !important;
  display: inline-flex !important;
  align-items: center !important;
  padding: 0 6px !important;
  flex: none !important;
}
.k-numerictextbox .k-input-validation-icon.k-hidden { display: none !important; }
.k-numerictextbox .k-input-validation-icon svg { width: 15px !important; height: 15px !important; fill: currentColor !important; }

span.k-input.k-numerictextbox:has(.k-input-validation-icon:not(.k-hidden)),
span.k-input.k-numerictextbox.k-invalid {
  border-color: var(--fb-red-500) !important;
}
span.k-input.k-numerictextbox:has(.k-input-validation-icon:not(.k-hidden)):focus-within,
span.k-input.k-numerictextbox.k-invalid:focus-within {
  box-shadow: 0 0 0 3px var(--fb-red-100) !important;
}

/* ---------- Devre Dışı Durumu ---------- */
span.k-input.k-numerictextbox.k-disabled,
span.k-input.k-numerictextbox[aria-disabled="true"] {
  opacity: 0.55 !important;
  background: var(--fb-slate-50) !important;
  cursor: not-allowed !important;
}
span.k-input.k-numerictextbox.k-disabled .k-input-inner,
span.k-input.k-numerictextbox.k-disabled .k-spin-button > .k-button {
  cursor: not-allowed !important;
}

.k-numerictextbox .k-select[style*="display: none"], .k-numerictextbox .k-select[style*="display:none"] { display: none !important; }
.k-numerictextbox .k-input-spinner[style*="display: none"], .k-numerictextbox .k-input-spinner[style*="display:none"] { display: none !important; }


.k-numerictextbox .k-select.k-hidden { display: none !important; }
.k-numerictextbox .k-input-spinner.k-hidden { display: none !important; }


#main {
    background-color: #fff !important;
    border-radius: 10px !important;
   -- border-top: 4px solid #e91e63 !important; /* formdaki pembe ?izgiye benzer */
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25) !important;
    padding: 6px !important;
    margin: 10px !important;
    transition: box-shadow 0.3s ease !important;
}

#main:hover {
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.35) !important;
}


#myTabContent1 > div:first-child { 
    background-color: #ffffff !important; /* Beyaz arka plan */ 
    border: none !important;
} 


#myTabContent1 > div:first-child { 
    background-color: #ffffff !important; /* Beyaz arka plan */ 
    border: none !important;
} 
.tab-content .containerdr {
    background-color: #ffffff !important;
}

#myTabContent1  { 
    background-color: #ffffff !important; /* Beyaz arka plan */ 
    border: none !important;
}
.tab-content{ 
    padding: 6px !important;
    border: none !important;
} 

.card-body{ 
    background-color: #ffffff !important; /* Beyaz arka plan */ 
    border: none !important;
} 

.label-boxed-list {
  

  padding: 4px;                                   /* I� bosluk */
  border-radius: 8px;                             /* K�seler yuvarlatilmis */
   box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1) !important;       /* Hafif g�lge efekti */
  display: inline-block;                          /* Kenarlik ve padding d�zg�n g�z�ks�n */
  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont,
               "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans",
               sans-serif, "Apple Color Emoji", "Segoe UI Emoji",
               "Segoe UI Symbol", "Noto Color Emoji" !important; /* Tailwind default sans */
}
.nct-label-must {
	    color: #1e3a8a !important; /* lacivert-mavi arasi ton */
    font-family: 'Segoe UI', 'Roboto', 'Helvetica Neue', sans-serif !important;
    font-weight: 600 !important;
    text-align: left !important;
    height: 22px !important;
    line-height: 22px !important;
    font-size: 16px !important;
    letter-spacing: 0.2px !important;
    display: inline-block !important;
    transition: color 0.3s ease, transform 0.2s ease !important;
}
.nct-label-must::after {
  content: "  *" !important; /* son karakterin ne oldugunu manuel yazman gerek */
  color: red !important;
  font-weight: bold !important;
}

.nct-label {
    color: #1e3a8a !important; /* lacivert-mavi arasi ton */
    font-family: 'Segoe UI', 'Roboto', 'Helvetica Neue', sans-serif !important;
    font-weight: 600 !important;
    text-align: left !important;
    height: 22px !important;
    line-height: 22px !important;
    font-size: 16px !important;
    letter-spacing: 0.2px !important;
    display: inline-block !important;
    transition: color 0.2s ease, transform 0.2s ease !important;
}

.nct-label-check {
    color: red !important; /* lacivert-mavi arasi ton */
    font-family: 'Segoe UI', 'Roboto', 'Helvetica Neue', sans-serif !important;
    font-weight: 600 !important;
    text-align: center!important;
    height: 22px !important;
    line-height: 22px !important;
    font-size: 16px !important;
    letter-spacing: 0.2px !important;
    display: inline-block !important;
    transition: color 0.2s ease, transform 0.2s ease !important;
}


/* =========================================================
   NCT Typography & Labels
   Modernize edilmiş başlık ve etiket (label) sınıfları
   ========================================================= */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

:root {
  --lbl-primary: #1e3a8a; /* Lacivert */
  --lbl-secondary: #475569; /* Slate */
  --lbl-danger: #dc2626; /* Kırmızı */
  --lbl-success: #16a34a; /* Yeşil */
  --lbl-font: 'Inter', 'Segoe UI', 'Roboto', sans-serif;
}

/* Standart Label */
.nct-label {
  color: var(--lbl-primary) !important;
  font-family: var(--lbl-font) !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  text-align: left !important;
  display: inline-block !important;
  margin-bottom: 4px !important;
  transition: color 0.2s ease !important;
}

/* Zorunlu Alan Label */
.nct-label-must {
  color: var(--lbl-primary) !important;
  font-family: var(--lbl-font) !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  text-align: left !important;
  display: inline-block !important;
  margin-bottom: 4px !important;
}

.nct-label-must::after {
  content: " *" !important;
  color: var(--lbl-danger) !important;
  font-weight: bold !important;
  margin-left: 2px !important;
}

/* Sağ Yaslı Label */
.nct-label-right {
  color: var(--lbl-primary) !important;
  font-family: var(--lbl-font) !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  text-align: right !important;
  display: inline-block !important;
}

/* Kırmızı Label */
.nct-label-red {
  color: var(--lbl-danger) !important;
  font-family: var(--lbl-font) !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  text-align: left !important;
}

/* Checkbox Label */
.nct-label-checkbox {
  color: var(--lbl-primary) !important;
  font-family: var(--lbl-font) !important;
  font-weight: 500 !important;
  font-size: 14px !important;
  text-align: left !important;
  cursor: pointer !important;
  vertical-align: middle !important;
}

/* Xpoda Özel Seçiciler */
.octopusitem[octopod-customcss=".nct-label"] > label,
[octopod-customcss=".nct-label"] .nct-label {
  color: var(--lbl-primary) !important;
  font-family: var(--lbl-font) !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  text-align: left !important;
  height: 22px !important;
  line-height: 22px !important;
  display: flex !important;
  align-items: center !important;
}

/* Başlıklar (Headers) */
.nct-h1 {
  color: var(--lbl-primary) !important;
  font-family: var(--lbl-font) !important;
  font-weight: 700 !important;
  font-size: 24px !important;
  margin-bottom: 12px !important;
}
.nct-h2 {
  color: var(--lbl-secondary) !important;
  font-family: var(--lbl-font) !important;
  font-weight: 600 !important;
  font-size: 20px !important;
  margin-bottom: 10px !important;
}
.nct-h3 {
  color: var(--lbl-primary) !important;
  font-family: var(--lbl-font) !important;
  font-weight: 600 !important;
  font-size: 18px !important;
  margin-bottom: 8px !important;
}

/* =========================================================
   Başlık Varyasyonları (Heading Designs)
   ========================================================= */

/* 1. Gradyan Başlık (Gradient Text) */
.nct-h-gradient {
  background: linear-gradient(90deg, #2563eb, #db2777) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  color: transparent !important; /* Fallback */
  font-family: var(--lbl-font) !important;
  font-weight: 800 !important;
  font-size: 26px !important;
  margin-bottom: 16px !important;
  position: relative !important;
  display: inline-block !important;
  padding-bottom: 6px !important;
}
.nct-h-gradient::after {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  bottom: 0 !important;
  width: 40px !important;
  height: 4px !important;
  background: linear-gradient(90deg, #2563eb, #db2777) !important; /* Çizgiyi de gradyan yaptık */
  border-radius: 2px !important;
  transition: width 0.3s ease !important;
}
.nct-h-gradient:hover::after {
  width: 100% !important;
}

/* 2. Altı Çizgili / Vurgulu Başlık (Accent Underlined) */
.nct-h-accent {
  color: var(--lbl-primary) !important;
  font-family: var(--lbl-font) !important;
  font-weight: 700 !important;
  font-size: 22px !important;
  margin-bottom: 16px !important;
  position: relative !important;
  display: inline-block !important;
  padding-bottom: 6px !important;
}
.nct-h-accent::after {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  bottom: 0 !important;
  width: 40px !important;
  height: 4px !important;
  background-color: #2563eb !important;
  border-radius: 2px !important;
  transition: width 0.3s ease !important;
}
.nct-h-accent:hover::after {
  width: 100% !important;
}

/* 3. Blok / Sol Kenarlık Vurgulu (Block/Ribbon) */
.nct-h-block {
  color: var(--lbl-primary) !important;
  background-color: #eff6ff !important;
  font-family: var(--lbl-font) !important;
  font-weight: 600 !important;
  font-size: 18px !important;
  padding: 8px 14px !important;
  border-left: 4px solid #2563eb !important;
  border-radius: 0 4px 4px 0 !important;
  margin-bottom: 12px !important;
}
.nct-h-block.success {
  background-color: #f0fdf4 !important;
  border-left-color: #16a34a !important;
  color: #166534 !important;
}
.nct-h-block.warning {
  background-color: #fefce8 !important;
  border-left-color: #ca8a04 !important;
  color: #854d0e !important;
}

/* 4. Kategori / Üst Başlık (Overline) */
.nct-h-overline {
  color: var(--lbl-secondary) !important;
  font-family: var(--lbl-font) !important;
  font-weight: 600 !important;
  font-size: 12px !important;
  text-transform: uppercase !important;
  letter-spacing: 1.5px !important;
  margin-bottom: 8px !important;
}

/* =========================================================
   Kurumsal Mimari Başlıkları (Corporate Headings)
   ========================================================= */

/* Kurumsal Ana Başlık (H1) */
.nct-corp-h1 {
  color: #0f172a !important; /* Koyu lacivert/siyah */
  font-family: var(--lbl-font) !important;
  font-weight: 700 !important;
  font-size: 26px !important;
  line-height: 1.2 !important;
  margin-bottom: 20px !important;
  padding-bottom: 10px !important;
  border-bottom: 1px solid #cbd5e1 !important; /* Temiz, tam genişlikte alt çizgi */
}

/* Kurumsal Bölüm Başlığı (H2) */
.nct-corp-h2 {
  color: #1e3a8a !important; /* Kurumsal lacivert */
  font-family: var(--lbl-font) !important;
  font-weight: 600 !important;
  font-size: 20px !important;
  line-height: 1.3 !important;
  margin-bottom: 16px !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}
/* Sol tarafında şık, kurumsal bir çubuk efekti */
.nct-corp-h2::before {
  content: "" !important;
  display: inline-block !important;
  width: 5px !important;
  height: 20px !important;
  background-color: #2563eb !important;
  border-radius: 2px !important;
}

/* Kurumsal Bölüm Başlığı (H2) - Alt Çizgili Versiyon */
.nct-corp-h2-underline {
  color: #1e3a8a !important;
  font-family: var(--lbl-font) !important;
  font-weight: 600 !important;
  font-size: 20px !important;
  line-height: 1.3 !important;
  margin-bottom: 16px !important;
  padding-bottom: 8px !important;
  border-bottom: 2px solid #e2e8f0 !important; /* Belirgin alt çizgi */
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}
/* Alt çizgili versiyonun yanına da isterseniz bar eklenebilir, ya da sadece çizgi olabilir. İkisini birden kullandım: */
.nct-corp-h2-underline::before {
  content: "" !important;
  display: inline-block !important;
  width: 5px !important;
  height: 20px !important;
  background-color: #2563eb !important;
  border-radius: 2px !important;
}

/* Kurumsal Alt Bölüm Başlığı (H3) */
.nct-corp-h3 {
  color: #334155 !important; /* Koyu slate */
  font-family: var(--lbl-font) !important;
  font-weight: 600 !important;
  font-size: 15px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.8px !important;
  margin-bottom: 12px !important;
  border-bottom: 1px dashed #e2e8f0 !important; /* Kesikli ayrıştırıcı */
  padding-bottom: 6px !important;
}

/* Kurumsal Detay Başlığı (H4) */
.nct-corp-h4 {
  color: #475569 !important; /* Orta slate */
  font-family: var(--lbl-font) !important;
  font-weight: 700 !important;
  font-size: 14px !important;
  margin-bottom: 8px !important;
  display: flex !important;
  align-items: center !important;
}
/* Küçük bir nokta/bullet efekti */
.nct-corp-h4::before {
  content: "•" !important;
  color: #94a3b8 !important;
  margin-right: 6px !important;
  font-size: 16px !important;
}

.modern-warning-badge {
    display: inline-flex;
    align-items: center;
    background-color: #fff5f5; /* �ok hafif kirmizi arka plan */
    color: #e53e3e; /* Modern, canli bir kirmizi */
    border: 1px solid #feb2b2; /* Ince bir sinir �izgisi */
    padding: 6px 12px;
    border-radius: 8px; /* Yumusak k�seler */
    font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.4;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
}

/* �zerine gelince �ok hafif bir derinlik katmak i�in */
.modern-warning-badge:hover {
    background-color: #fff1f1;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
/* =================================================================== */
/* 1. HEADER ANA KAPLAYICI (STICKY / YAPIŞKAN VE SABİT YÜKSEKLİK)      */
/* =================================================================== */
.page-dashboard header {
    position: sticky !important; /* ARTIK YAPIŞKAN! Sayfa kaysa da üstte kalır */
    top: 0 !important;           /* En tepeye yapışması için */
    background-color: #ffffff !important;
    height: 70px !important;
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08) !important;
    border-bottom: 1px solid #e5e7eb !important;
    padding: 0 20px !important;
    z-index: 1000 !important; /* Diğer her şeyin üstünde kalması için */
}

/* =================================================================== */
/* 2. BOOTSTRAP GRID DÜZELTMELERİ (ROW ve COL)                         */
/* =================================================================== */

.page-dashboard header .row {
    width: 100% !important;
    margin: 0 !important;
    display: flex !important;
    justify-content: space-between !important; /* Logo sola, Profil sağa iter */
    align-items: center !important;
    height: 100% !important;
}

.page-dashboard header .col-6 {
    display: flex !important;
    align-items: center !important;
    height: 100% !important;
    padding: 0 !important;
}

/* Sol Taraf (Logo Alanı) */
.page-dashboard header .col-6:first-child {
    justify-content: flex-start !important;
}

/* Sağ Taraf (Profil Alanı) - SAĞA HİZALAMA GARANTİSİ */
.page-dashboard header .col-6:last-child {
    justify-content: flex-end !important;
}

/* =================================================================== */
/* 3. LOGO VE ETİKET AYARLARI                                          */
/* =================================================================== */

.page-dashboard header .logo {
    float: none !important;
    margin: 0 !important;
    max-height: 45px !important;
    width: auto !important;
    display: block !important;
}

.page-dashboard header #span-environment {
    position: static !important;
    margin-left: 15px !important;
    transform: none !important;
    left: auto !important;
}
/* =================================================================== */
/* DÜZELTİLMİŞ PROFİL KARTI (SIKI VE DÜZGÜN ARALIKLI)                  */
/* =================================================================== */

.header-profile {
    /* 1. Kutu Yapısı: İçeriği kadar yer kaplasın (260px olmayacak) */
    display: inline-flex !important; 
    width: auto !important;          
    min-width: 0 !important;         
    max-width: 100% !important;
    
    /* 2. Hizalama: İkon ve Yazı yan yana, bitişik olsun */
    align-items: center !important;
    justify-content: flex-end !important; /* Veya center, artık fark etmez çünkü kutu daraldı */
    
    /* 3. Aralık Ayarı: İkon ve yazı arasındaki net mesafe */
    gap: 10px !important; 
    
    /* 4. Konum: Sayfanın en sağına itmek için */
    margin-left: auto !important; 
    margin-right: 0 !important;

    /* Görünüm */
    background: transparent !important;
    border: none !important;
    padding: 5px 15px !important; /* Tıklama alanı için makul boşluk */
    cursor: pointer;
    height: 100% !important; /* Header yüksekliğine uyum sağlasın */
}

/* İsim alanının gereksiz uzamasını engellemek için ek güvenlik */
.header-profile .names {
    flex: 0 1 auto !important; /* Genişlemesin, içeriği kadar olsun */
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    white-space: nowrap !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    color: #444 !important;
    text-align: right !important; /* Yazıyı sağa dayalı tut */
}

/* İkon ayarları */
.header-profile .avatar, 
.header-profile .avatar i {
    flex-shrink: 0 !important; /* İkonun ezilmesini engelle */
    margin: 0 !important;
    font-size: 22px !important;
    color: #555 !important;
    display: flex !important;
    align-items: center !important;
}
/* =================================================================== */
/* 5. DROPDOWN MENÜ KONUMU (HEADER'A GÖRE SABİTLENDİ)                  */
/* =================================================================== */

.page-dashboard header .dropdown-menu,
.navbar-nav .dropdown-menu {
    position: absolute !important;
    top: 65px !important; /* Header 70px, 5px yukarıda estetik durur */
    right: 15px !important; /* En sağdan 15px içeride */
    left: auto !important;
    margin-top: 0 !important;
    transform: none !important; /* JS müdahalesini engeller */
    
    /* Görsellik */
    border-radius: 8px !important;
    border: 1px solid #eee !important;
    box-shadow: 0 5px 20px rgba(0,0,0,0.15) !important;
    padding: 10px 0 !important;
    min-width: 200px !important;
    z-index: 9999 !important;
    background-color: #fff !important;
}

/* Dropdown oklarını gizle */
.page-dashboard header .dropdown-menu::before,
.page-dashboard header .dropdown-menu::after {
    display: none !important;
}

.header-profile .avatar {
    padding-left: 8px !important;
    border-radius: 50% !important;
    width: 40px !important;
    height: 40px !important;
    float: right !important;
    text-align: center !important;
    background-color: #ececec !important;
	padding-bottom: 10px !important;
}

/* =================================================================== */
/* ADMIN: PAGE BODY SPACING OVERRIDE                                   */
/* (Theme bazı sayfalarda .page-body'e 160px margin-top verebiliyor)    */
/* =================================================================== */
.page-dashboard .page-body,
.page-dashboard div.page-body {
    margin-top: 40px !important;
    padding-top: 40px !important;
}

/* ========================================================= */
/* Floating Footer (global <footer>)                          */
/* ========================================================= */
html body footer {
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    z-index: 1200 !important;

    background: rgba(255, 255, 255, 0.85) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    border-top: 1px solid #e5e7eb !important;

    padding: 10px 16px !important;
    font-family: 'Inter', 'Segoe UI', 'Roboto', sans-serif !important;
    color: #6b7280 !important;
}

html body footer p {
    margin: 0 !important;
    font-size: 12px !important;
    line-height: 1.4 !important;
    text-align: center !important;
    letter-spacing: 0.2px !important;
}

/* Replace footer text with "Powered by Xpoda" (without touching HTML) */
html body footer p {
    font-size: 0 !important; /* hide existing text */
}

html body footer p::before {
    content: "@ 2026 NoCodeTime - Powered by Xpoda" !important;
    font-size: 12px !important;
    line-height: 1.4 !important;
    letter-spacing: 0.2px !important;
    color: #6b7280 !important;
}

/* Give page content breathing room above footer */
html body {
    padding-bottom: 56px !important;
}

@media (max-width: 768px) {
    html body footer {
        padding: 10px 12px !important;
    }
    html body footer p {
        font-size: 11px !important;
    }
    html body {
        padding-bottom: 60px !important;
    }
}
:root {
	--mainColor : #004aad;
	--mainColor2 : #004aad;
	--mainColor3 : #004aad;
}
@font-face {
  font-family: Arial !important;
}

body {
	font-family: Arial !important;
}

.page-account .btn,
.page-account header {
	background: #1B53A3 !important;
}
.page-dashboard header{
	background: #1B53A3 !important;
}
.navbar.default-layout .navbar-brand-wrapper{
	background: #1B53A3 !important;
}
.sidebar, .sidebar > .nav .nav-item .collapse {
    background: linear-gradient(180deg,#1B53A3 ,#338afd ) !important;
}
.page-dashboard .navigation ul .nav-item.active,
.page-dashboard .navigation ul .nav-item:hover {
	border-bottom: 2px solid 
}
.sidebar > .nav .nav-item > .nav-link:hover,
.sidebar > .nav .nav-item:not(.hover-open) .collapse .sub-menu .nav-item:hover {
	background: #004aad !important;
}
.sidebar > .nav .nav-item .nav-link .menu-title,.sidebar > .nav .nav-item .nav-link{
	font-size:0.8rem !important;
}
.nav.nav-tabs.bordered li a.active {
	background: #1B53A3 !important;
}
.nct-btn {
	background-color: #1B53A3 !important;
	color:  !important;
	font-family: Arial !important;
	font-size:15px !important;
	margin-top:20px !important;
}
.nct-btn>span {
	padding-top:0 !important;
}
.nct-btn:Hover {
	background-color: #334aad !important;
}
.nct-btn:active, .nct-btn:visited {
	background-color: var(--mainColor2) !important;
}
.k-button:not([disabled],.k-taskboard-column-action-button, .k-taskboard-card-menu-button).nct-btn-link {
	border:none !important;
	background:#fff !important;
	color:rgba(127, 140, 141,1.0) !important;
	text-decoration:underline;
	box-shadow: none !important;
}
.k-button:not([disabled],.k-taskboard-column-action-button, .k-taskboard-card-menu-button).nct-btn-link:hover {
	color: #43bbff !important;
}


.nct-label-c {
	color: #1B53A3 !important;
	font-family: Arial !important;
	font-weight:bold !important;
	text-align:left !important;
	height:20px !important;
	line-height:20px !important;	
    	font-size:13px !important;
	background-color: #f9f9f9 !important;
	text-align:center !important;
}
.nct-h1, .nct-h2, .nct-h3, .nct-h4 {
	background-color: #fff !important;
	background-image: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,.02), rgba(0,0,0,.05)) !important;
	color: #1B53A3 !important;
	border-left: 10px solid ;
	border-bottom: 1px solid ;
	border-radius:20px;
	font-family: Arial !important;
	font-weight:bold !important;
	text-align:left !important;
	height:30px !important;
	line-height:30px !important;
	padding:0;
	margin:0;
	padding-left: 10px;
        font-family: Arial !important;
}

.nct-h1 {
	font-size:20px !important;
	color: #1B53A3 !important;
	border-left: 10px solid ;
	border-bottom: 1px solid ;
        font-family: Arial !important;
}
.nct-h2 {
	font-size:16px !important;
	color: #1B53A3 !important;
	border-left: 10px solid ;
	border-bottom: 1px solid ;
        font-family: Arial !important;
}
.nct-h3 {
	font-size:14px !important;
	color: #1B53A3 !important;
	border-left: 10px solid ;
	border-bottom: 1px solid ;
        font-family: Arial !important;
}
.nct-h4 {
	font-size:13px !important;
	color: #1B53A3 !important;
	border-left: 10px solid ;
	border-bottom: 1px solid ;
        font-family: Arial !important;
}

.menu-counter {
    position: absolute;
    bottom: 20px;
    right: 20px;
    background-color: #007bff;
    color: white;
    padding: 5px 10px;
    border-radius: 5px;
    font-size: 16px;
    font-family: Arial !important;
}
.nct-list {
	border: none;
}
.nct-list .k-alt {
	background: none;
}
.nct-list.k-grid tr td {
	text-align:left !important;
	border: none;
}
.nct-list.k-grid .k-grid-header .k-header {
	padding: 0 7px;
	height:12px;
}
.nct-list img {
	border-radius:100px;
}

.nct-progress-label {
	padding-left: 30px !important;
	padding-top: 7px !important;
}
.nct-progress.k-widget {
	background-color: rgba(192, 57, 43,1.0);
}
.nct-progress.k-widget .k-state-selected {
	background-color: #52ca42;
	border:none;
	top:0;
}
.nct-progress.k-widget .k-progress-status {
	margin-top: 0;
	font-size: 12px;
	display:hidden;
        font-family: Arial !important;
}
.nct-h1:hover, .nct-h2:hover, .nct-h3:hover, .nct-h4:hover {
	color: var(--mainColor2) !important;
	border-left: 10px solid var(--mainColor2);
	border-bottom: 1px solid var(--mainColor2);
}
.nct-line {
	background-color:red;
}
.card .card-body {
	padding:0 !important; 
	margin:0 !important;
}
.containerdr {
	background-color: #f9f9f9 !important;
}
.nct-widget {
	background-color: #fff !important;
	box-shadow: 2px 2px 5px #1685cf50 !important;
	border: 1px solid #ccc !important;
	/*border-color:  #ccc #1685cf #1685cf #ccc !important;*/
	text-shadow: 1px 1px 1px #eee !important;
	padding-left: 50px !important;
	padding-top: 10px !important;
	font-size:16px !important;
	font-weight:bold !important;
	color: #1685cf !important;
	
}
.octopusitem .fa {
	padding-left:10px;
	padding-top:15px;
}

.page-account {
    margin: 0;
    padding: 0;
    font-family: "SFPro", sans-serif;
    font-weight: 500;
}
.page-account .page-body .section-account {
	max-width:inherit;
}
.login-bg {
	overflow:hidden;
	border:none;
	padding: 25px;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	height:100vh;
}

#myVideo {
  height: 100%;
}
.login-parag {
	height:20vh;
}

@media only screen and (max-width: 960px){
	.mobileLogin{
		height: 34.7px !important;
	}
	
	#myVideo {
		width: 100%;
		margin-left:-15vw;
	}
	.login-bg {
		height:auto;
	}
	.login-parag {
		height:50px;
	}
}
#login-form .form-control {
	border-radius:100px;
	height:40px;
	font-size:16px;
	padding:0 32px;
	background-color:#f6f6f6;
        font-family: Arial !important;
}
#BtnLogin {
	border-radius:100px;
	height:40px;
	border:none;
	font-size:20px;
	padding:0 65px;
	background-color:#0e2a3a;
	color:#fff;
	display:block;
	width:100%;
	font-weight:700;
	margin-top:20px;
        font-family: Arial !important;
}
#act-swtich-user {
	color: #0e2a3a50 !important;
}
#footer {
	position: absolute;
	bottom:0;
}
.nav.nav-tabs.bordered a {
	font-weight:bold;
	color:#86754e;
}
.nct-btn-kanban .md-mode-edit{
	padding:0;
}
body.page-dashboard {
	font-size: 13px;
}
.responsive .xrow {
    width: auto !important;
}
@import url('https://fonts.googleapis.com/css2?family=inter:wght@400;500;600;700&display=swap');

/* =================================================================== */
/* 1. GENEL SIFIRLAMA (Çok Önemli)                                     */
/* =================================================================== */

/* Varsayılan olarak TÜM sidebar linklerinin arka planını temizle */
/* Bu kural "istenmeyen mavi arka planları" yok eder. */
html body #sidebar .nav-item .nav-link {
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
    border: 1px solid transparent !important;
    color: #374151 !important; /* Standart Gri Yazı */
    opacity: 1 !important;
    
    /* Animasyon */
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
    margin: 2px 10px !important;
    width: auto !important;
    border-radius: 10px !important;
    display: flex !important;
    align-items: center !important;
    padding: 10px 15px !important;
}

/* İkonları özgür bırak (Rengi miras alsın) */
html body #sidebar .nav-item .nav-link i,
html body #sidebar .nav-item .menu-icon,
html body #sidebar .nav-item .nav-link svg {
    color: inherit !important;
    opacity: 1 !important;
    filter: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 18px !important;
    width: 24px !important;
    text-align: center !important;
    margin-right: 12px !important;
}

/* ------------------------------- */
/* 2. HOVER (ÜZERİNE GELİNCE)      */
/* ------------------------------- */
html body #sidebar .nav-item:not(.nav-profile) .nav-link:hover {
    background-color: #ffffff !important;   /* Hoverda Beyaz */
    color: #2563eb !important;             /* Yazı Mavi */
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05) !important;
    transform: translateX(8px) !important; /* Sağa kayma */
    border-color: #d1d5db !important;

}

/* Hoverda ikonlar da mavi olsun */
html body #sidebar .nav-item:not(.nav-profile) .nav-link:hover i,
html body #sidebar .nav-item:not(.nav-profile) .nav-link:hover .menu-title {
    color: #2563eb !important;
}

/* ------------------------------- */
/* 3. ACTIVE LEAF (SADECE SEÇİLİ OLAN) - EN KRİTİK KISIM */
/* ------------------------------- */

/* JS ile eklediğimiz 'active-leaf' sınıfı varsa BOYA */
html body #sidebar .nav-item.active-leaf > .nav-link {
    background: linear-gradient(90deg, rgba(37,99,235,0.15) 0%, rgba(255,255,255,0) 100%) !important;
    border-left: 4px solid #2563eb !important; /* Sol Mavi Çizgi */
    color: #2563eb !important; /* Yazı Mavi */
    font-weight: 700 !important;
    border-radius: 0 10px 10px 0 !important;
    box-shadow: none !important;
}

/* ------------------------------- */
/* 4. ACTIVE PARENT (ÜST MENÜ)     */
/* ------------------------------- */

/* Üst menü sadece 'active'dir, 'active-leaf' DEĞİLDİR. */
/* O yüzden arkası ŞEFFAF kalır, sadece yazısı Mavi olur. */
html body #sidebar .nav-item.active:not(.active-leaf) > .nav-link {
    background: transparent !important;
    border-left: 4px solid transparent !important;
    color: #2563eb !important;
}

/* ------------------------------- */
/* 5. İKON VE YAZI RENK YÖNETİMİ   */
/* ------------------------------- */

/* Her türlü aktif durumda (Leaf veya Parent) ikon ve yazı mavi olsun */
html body #sidebar .nav-item.active > .nav-link i,
html body #sidebar .nav-item.active > .nav-link .menu-title,
html body #sidebar .nav-item.active > .nav-link span,
html body #sidebar .nav-item.active > .nav-link .custom-menu-icon {
    color: #2563eb !important;
}

/* İSTİSNA: Renkli Emojiler ve Resimler Mavi Olmasın */
html body #sidebar .nav-item.active > .nav-link .emoji-icon,
html body #sidebar .nav-item.active > .nav-link img.custom-menu-icon {
    color: initial !important;
    filter: none !important;
}

/* ------------------------------- */
/* 6. ALT MENÜ ÖZEL AYARLARI       */
/* ------------------------------- */

/* Alt menü linkleri (Sub-menu items) için kesin kural */
/* Eğer active değilse, kesinlikle GRİ ve ŞEFFAF kal */
html body #sidebar .sub-menu .nav-item:not(.active) > .nav-link {
    background: transparent !important;
    color: #374151 !important;
}

/* Girintiler */
html body #sidebar .sub-menu .nav-item .nav-link { padding-left: 35px !important; }
html body #sidebar .sub-menu .sub-menu .nav-item .nav-link { padding-left: 50px !important; }

/* ------------------------------- */
/* 7. DİĞER TEMİZLİKLER            */
/* ------------------------------- */
html body #sidebar .nav-item::before, html body #sidebar .nav-item::after,
html body #sidebar .nav-link::before, html body #sidebar .nav-link::after {
    display: none !important;
}

/* Sidebar Genel Yapı */
html body nav#sidebar, html body .sidebar {
    background: #ffffff !important;
    border-right: 1px solid #e5e7eb !important;
}
html body .container-scroller .navbar .navbar-brand-wrapper {
   // background: #ffffff !important;
    border-bottom: 1px solid #e5e7eb !important;
}

/* Sidebar içindeki taşma engelini kaldır */
#sidebar, .sidebar-offcanvas, .nav-item.nav-profile {
    overflow: visible !important;
}



/* Çıkış yapma işlemlerini gösteren buyyonun tasarımı için */

/* 1. Kapsayıcının (Sidebar) sınırlarını tamamen geçersiz kılalım */
#sidebar, 
.sidebar-offcanvas, 
.nav-item.nav-profile {
    overflow: visible !important;
    z-index: 999 !important;
}

/* 2. Menü açıldığında tarayıcının hesapladığı koordinatları devre dışı bırakalım */
div.dropdown-menu.show[aria-labelledby="dropdownMenuLink"] {
    position: fixed !important; /* Ekrana sabitler, sidebar dışına taşır */
    z-index: 2147483647 !important; /* Tarayıcıdaki en yüksek z-index */
    
    /* Otomatik hesaplanan transformu (translate3d) iptal eder */
    transform: none !important; 
    
    /* Görseldeki butona göre konumu manuel sabitleyelim */
    /* Bu değerleri butonun altına gelecek şekilde ince ayar yapabilirsin */
    top: 95px !important; 
    left: 10px !important;
    
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    
    /* Menünün diğer kartların arkasında kalmasını engellemek için */
    background-color: white !important;
    min-width: 200px !important;
}

/* 3. Menü içindeki linklerin (Yönetim Paneli vb.) görünürlüğünü garanti edelim */
.dropdown-item {
    display: flex !important;
    align-items: center !important;
    background-color: white !important;
    color: #333 !important;
}
@import url('https://fonts.googleapis.com/css2?family=inter:wght@400;500;600;700&display=swap');

/* =================================================================== */
/* 1. KISIM: SADECE YAZILARI GRİ YAP, İKONLARA DOKUNMA               */
/* =================================================================== */

/* YAZILAR: Standart Gri (#374151) olmaya devam etsin */
html body #sidebar .nav-item .nav-link span,
html body #sidebar .nav-item .nav-link .menu-title {
    opacity: 1 !important;
    filter: none !important;
    color: #374151 !important; 
}

/* İKONLAR İÇİN ÖZGÜRLÜK: */
/* İkonlara hiçbir renk atamıyoruz. 'inherit' diyerek kendi hallerine bırakıyoruz. */
html body #sidebar .nav-item .nav-link i,
html body #sidebar .nav-item .menu-icon,
html body #sidebar .nav-item .nav-link svg {
    opacity: 1 !important;
    filter: none !important;
    color: inherit !important; /* Kendi orijinal rengini kullansın */
    fill: inherit !important;  /* SVG'ler için de geçerli */
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* ------------------------------- */
/* SABİT SIDEBAR (MASAÜSTÜ)        */
/* ------------------------------- */
html body nav#sidebar,
html body .sidebar,
html body .sidebar-offcanvas {
    background: #ffffff !important;
    border-right: 1px solid #e5e7eb !important;
    position: fixed !important;
    left: 0 !important;
    top: 60px !important;
    bottom: 0 !important;
    width: 260px !important;
    height: calc(100vh - 60px) !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    z-index: 1000 !important;
    padding-bottom: 20px !important;
    transition: transform 0.3s ease-in-out !important;
}

/* ------------------------------- */
/* MOBİLDE SABİT OLMASIN           */
/* ------------------------------- */
@media(max-width: 768px) {
    html body nav#sidebar,
    html body .sidebar,
    html body .sidebar-offcanvas {
        position: fixed !important;
        transform: translateX(-100%);
    }

    html body nav#sidebar.active,
    html body .sidebar.active,
    html body .sidebar-offcanvas.active {
        transform: translateX(0) !important;
    }
}

html body #sidebar::-webkit-scrollbar { width: 5px; }
html body #sidebar::-webkit-scrollbar-track { background: transparent; }
html body #sidebar::-webkit-scrollbar-thumb { background-color: #d1d5db; border-radius: 4px; }
html body #sidebar::-webkit-scrollbar-thumb:hover { background-color: #9ca3af; }

/* Menü Temizliği */
html body #sidebar .nav,
html body #sidebar .nav-item,
html body #sidebar .nav-link,
html body #sidebar .collapse,
html body #sidebar .sub-menu {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    border: none !important;
    transition: none !important;
}

html body #sidebar .nav-item .nav-link {
    font-size: 13px !important;
    font-weight: 600 !important;
    padding: 12px 15px !important;
    display: flex !important;
    align-items: center !important;
    background-color: transparent !important;
}

html body #sidebar .nav-item .nav-link i {
    font-size: 18px !important;
    margin-right: 12px !important;
    width: 20px !important;
    text-align: center;
}

/* Hover Efektleri */
html body #sidebar .nav-link:hover {
    background-color: #f3f4f6 !important;
    color: #2563eb !important; 
    border-radius: 6px !important;
    opacity: 1 !important;
}

html body #sidebar .nav-link:hover span,
html body #sidebar .nav-link:hover .menu-title,
html body #sidebar .nav-link:hover i {
    color: #2563eb !important;
    opacity: 1 !important;
}

/* Active ve Expanded Efektleri */
html body #sidebar .nav-link[aria-expanded="true"], 
html body #sidebar .nav-item.active > .nav-link,
html body #sidebar .sub-menu .nav-item.active .nav-link {
    background-color: #eff6ff !important; 
    color: #2563eb !important; 
    font-weight: 700 !important;
    border-radius: 6px !important;
    opacity: 1 !important;
}

html body #sidebar .nav-item.active > .nav-link i,
html body #sidebar .nav-link[aria-expanded="true"] i,
html body #sidebar .sub-menu .nav-item.active .nav-link i {
    color: #2563eb !important;
    opacity: 1 !important;
}

/* Sub-Menu Arka Planı */
html body #sidebar .sub-menu,
html body #sidebar .collapse.show {
    background-color: #ffffff !important;
    padding: 5px 0 !important;
}

html body #sidebar .sub-menu .nav-item .nav-link {
    padding-left: 45px !important;
}
html body #sidebar .sub-menu .sub-menu .nav-item .nav-link {
    padding-left: 65px !important;
}

/* Before/After Temizliği */
html body #sidebar .nav-item::before, html body #sidebar .nav-item::after,
html body #sidebar .nav-link::before, html body #sidebar .nav-link::after,
html body #sidebar .collapse::before, html body #sidebar .collapse::after {
    display: none !important;
    content: none !important;
}

/* Navbar Marka ve Profil Alanı */
html body .navbar-brand-wrapper,
html body .nav-profile {
    background-color: #ffffff !important;
    border-bottom: 1px solid #e5e7eb !important;
}
html body .navbar-brand-wrapper *,
html body .nav-profile .profile-name {
    color: #111827 !important;
}

/* Profile Section Detayları */
.nav-profile { padding: 14px !important; border-bottom: 1px solid var(--border-light) !important; margin-bottom: 8px !important; background-color: var(--surface-light) !important; }
.nav-profile .nav-link { display: flex !important; align-items: center !important; gap: 12px !important; padding: 0 !important; text-decoration: none !important; background-color: transparent !important; }
.nav-profile .nav-link:hover { background-color: transparent !important; }
.profile-image { position: relative; width: 40px; height: 40px; flex-shrink: 0; }
.profile-image img { width: 40px !important; height: 40px !important; border-radius: 50% !important; background-color: var(--hover-light); object-fit: cover; }
.dot-indicator { position: absolute; bottom: 2px; right: 2px; width: 10px; height: 10px; border-radius: 50%; border: 2px solid var(--surface-light); }
.bg-success { background-color: #10b981 !important; }
.text-wrapper { flex: 1; }
.profile-name { font-size: 10px !important; font-weight: 600 !important; color: var(--text-light) !important; margin: 0 !important; line-height: 1.4 !important; }
.designation { font-size: 13px !important; color: var(--yellow-accent) !important; margin: 2px 0 0 0 !important; line-height: 1.4 !important; }

/* Menu Action Icon */
.menu-action-icon { opacity: 0 !important; margin-left: 8px !important; padding: 4px !important; border-radius: 4px !important; transition: all 0.2s ease !important; flex-shrink: 0 !important; }
.nav-link:hover .menu-action-icon { opacity: 1 !important; }
.menu-action-icon:hover { background-color: rgba(0, 0, 0, 0.05) !important; }

/* Utility Classes */
.d-flex { display: flex !important; }
.align-items-center { align-items: center !important; }
.justify-content-between { justify-content: space-between !important; }
.flex-grow-1 { flex-grow: 1 !important; }
.flex-column { flex-direction: column !important; }
.collapsed .menu-arrow { transform: rotate(0deg) !important; }
@media (max-width: 768px) { .sidebar { width: 100%; position: relative; } }

/* Sidebar Profile Card Styles */
html body #sidebar .nav-item.nav-profile { margin: 15px auto !important; width: 90% !important; background-color: #ffffff !important; border-radius: 12px !important; box-shadow: 0 3px 15px rgba(0, 0, 0, 0.08) !important; border: 1px solid #e5e7eb !important; border-bottom: none !important; padding: 0 !important; transition: all 0.3s ease !important; }
html body #sidebar .nav-item.nav-profile .nav-link { height: auto !important; display: flex !important; align-items: center !important; padding: 8px 10px 8px 12px !important; border-radius: 12px !important; width: 100% !important; }
html body #sidebar .nav-item.nav-profile .profile-image { margin-right: 12px !important; flex-shrink: 0 !important; position: relative; display: flex !important; align-items: center !important; justify-content: center !important; }
html body #sidebar .nav-item.nav-profile .profile-image img { width: 40px !important; height: 40px !important; border-radius: 50% !important; object-fit: cover !important; border: 2px solid #f9fafb !important; }
html body #sidebar .nav-item.nav-profile .dot-indicator { border: 2px solid #ffffff !important; width: 10px !important; height: 10px !important; bottom: 1px !important; right: 1px !important; }
html body #sidebar .nav-item.nav-profile .text-wrapper { display: flex !important; flex-direction: column !important; justify-content: center !important; line-height: 1.2 !important; overflow: hidden !important; }
html body #sidebar .nav-item.nav-profile .profile-name { margin-bottom: 1px !important; font-weight: 700 !important; color: #1f2937 !important; font-size: 10px !important; white-space: nowrap !important; }
html body #sidebar .nav-item.nav-profile .designation { font-size: 11px !important; color: #2563eb !important; margin: 0 !important; font-weight: 500 !important; }
html body #sidebar .nav-item.nav-profile:hover { transform: translateY(-2px) !important; box-shadow: 0 6px 20px rgba(0, 0, 0, 0.1) !important; border-color: #d1d5db !important; cursor: pointer !important; }

/* Normal Nav Items Styling */
html body #sidebar .nav-item:not(.nav-profile) .nav-link { transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) !important; margin: 2px 10px !important; width: auto !important; border-radius: 10px !important; border: 1px solid transparent !important; }
html body #sidebar .nav-item:not(.nav-profile) .nav-link:hover { background-color: #ffffff !important; color: #2563eb !important; box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05) !important; transform: translateX(8px) !important; border-color: #d1d5db !important; }
html body #sidebar .nav-item:not(.nav-profile) .nav-link:hover i, html body #sidebar .nav-item:not(.nav-profile) .nav-link:hover .menu-title { color: #2563eb !important; }
html body #sidebar .sub-menu .nav-item .nav-link:hover { background-color: #f9fafb !important; transform: translateX(5px) !important; box-shadow: none !important; }
html body #sidebar .nav-item:not(.nav-profile).active > .nav-link { background-color: #eff6ff !important; color: #2563eb !important; font-weight: 700 !important; box-shadow: 0 2px 5px rgba(37, 99, 235, 0.1) !important; }

/* Navbar Brand Wrapper */
html body .container-scroller .navbar.default-layout .navbar-brand-wrapper,
html body .container-scroller .navbar .navbar-brand-wrapper,
html body nav .navbar-brand-wrapper {
    //background: #f2f2f2 !important;        
    background-color: #ffffff !important;
  //  background-image: none !important;
    border-right: 1px solid #dcdcdc !important; 
    border-bottom: 1px solid #dcdcdc !important;
    box-shadow: none !important;
}

/* ÜST MENÜ İKONLARI: Siyah yapma, kendi renginde bırak */
html body #toggle-side-menu,
html body .navbar-brand-wrapper .mdi,
html body .navbar-brand-wrapper .mdi::before,
html body .navbar-brand-wrapper button span {
    color: inherit !important; 
    fill: inherit !important;
    opacity: 1 !important;
    visibility: visible !important;
    display: inline-block !important;
    font-size: 26px !important;
}

/* MOBİL Gizleme */
@media (max-width: 768px) {
    html body #toggle-side-menu,
    html body .navbar-brand-wrapper .mdi,
    html body .navbar-brand-wrapper .mdi::before,
    html body .navbar-brand-wrapper button span {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
    }
}

/* Logo Filtreleri: Logoyu da siyah yapma */
html body .container-scroller .navbar .navbar-brand-wrapper .brand-logo img,
html body .container-scroller .navbar .navbar-brand-wrapper .brand-logo-mini img { 
    filter: none !important; /* Parlaklık filtresini kaldır */
    opacity: 1 !important; 
}
@media (max-width: 768px) {
    html body .container-scroller .navbar .navbar-brand-wrapper .brand-logo img,
    html body .container-scroller .navbar .navbar-brand-wrapper .brand-logo-mini img { filter: none !important; opacity: 1 !important; }
}

/* --- SEÇİLİ ELEMAN (ACTIVE) STİLLERİ --- */
html body #sidebar .nav-item.active > .nav-link,
html body #sidebar .sub-menu .nav-item.active > .nav-link {
    background: linear-gradient(90deg, rgba(37,99,235,0.15) 0%, rgba(255,255,255,0) 100%) !important;
    border-left: 4px solid #2563eb !important; 
    color: #2563eb !important;
    font-weight: 700 !important;
    border-radius: 0 10px 10px 0 !important;
}

html body #sidebar .nav-item.active > .nav-link i,
html body #sidebar .nav-item.active > .nav-link .menu-title,
html body #sidebar .nav-item.active > .nav-link span {
    color: #2563eb !important;
}

/* Collapse olan parent active ise yazı rengi */
html body #sidebar .nav-item.active > .nav-link[data-toggle="collapse"] {
    background: transparent !important;
    border-left: 4px solid transparent !important;
    color: #374151 !important; 
}

html body #sidebar .nav-item.active > .nav-link[href*="Dashboard"],
html body #sidebar .nav-item.active > .nav-link:not([data-toggle="collapse"]) {
    color: #2563eb !important;
}

html body #sidebar .sub-menu .nav-item .nav-link {
    padding-left: 45px !important;
    border-left: 4px solid transparent !important;
}

/* --- İKON BOYUTLANDIRMA VE RENK (ALT MENÜ DÜZELTMESİ) --- */
html body #sidebar .nav-item .nav-link i,
html body #sidebar .sub-menu .nav-item .nav-link i,
html body #sidebar .nav-item .menu-icon {
    font-size: 18px !important;   
    width: 24px !important;       
    min-width: 24px !important;   
    text-align: center !important; 
    margin-right: 12px !important; 
    line-height: 1 !important;
    vertical-align: middle !important;
    display: inline-flex !important;
    justify-content: center !important;
    align-items: center !important;
}

html body #sidebar .nav-item .nav-link i::before {
    font-size: 18px !important;
}

/* DÜZELTME: Alt menü ikonları da kendi renklerinde kalsın */
html body #sidebar .sub-menu .nav-item .nav-link i {
    opacity: 1 !important;
    color: inherit !important; /* Gri değil, orijinal renk */
}

/* Seçili olduğunda mavi */
html body #sidebar .nav-item.active > .nav-link i,
html body #sidebar .sub-menu .nav-item.active > .nav-link i {
    color: #2563eb !important;
}

/* ========================================================== */
/* --- İÇ İÇE MENÜLER İÇİN GİRİNTİ VE METİN DÜZENLEMESİ --- */
/* ========================================================== */
html body #sidebar .sub-menu .nav-item .nav-link { padding-left: 35px !important; }
html body #sidebar .sub-menu .sub-menu .nav-item .nav-link { padding-left: 50px !important; }
html body #sidebar .nav-item .nav-link { height: auto !important; min-height: 40px !important; align-items: center !important; padding-top: 8px !important; padding-bottom: 8px !important; }
html body #sidebar .nav-item .nav-link .menu-title { white-space: normal !important; display: inline-block !important; line-height: 1.3 !important; vertical-align: middle !important; max-width: 170px !important; }
html body #sidebar .nav-item .nav-link i { align-self: center !important; margin-top: 0 !important; }

/* =================================================================== */
/* LOGO ALANI ARKA PLANI (SIDEBAR İLE EŞİTLENDİ - TAM BEYAZ)           */
/* =================================================================== */
html body .container-scroller .navbar.default-layout .navbar-brand-wrapper,
html body .container-scroller .navbar .navbar-brand-wrapper,
html body nav .navbar-brand-wrapper {
  //  background: #ffffff !important;        /* #f2f2f2 yerine #ffffff yapıldı */
  //  background-color: #ffffff !important;  /* Tam beyaz */
    background-image: none !important;
    border-right: 1px solid #e5e7eb !important; /* Kenarlık rengi sidebar ile uyumlu hale getirildi */
    border-bottom: 1px solid #e5e7eb !important;
    box-shadow: none !important;
}
/* Ana Tablo �er�evesi */
.k-grid {
    font-family: 'Figtree', 'Roboto', 'Segoe UI', sans-serif !important;
    background-color: #fff !important;
    border: 1px solid #d0d4e4 !important;
    border-radius: 8px !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05) !important;
    font-size: 15px !important;
}

/* Header Alani */
.k-grid-header {
    padding-right: 0 !important; 
    border-radius: 8px 8px 0 0 !important;
}

/* Baslik H�creleri (Header Cells) */
.k-grid-header .k-header {
    background-color: #fff !important;
    background-image: none !important;
    color: #676879 !important; 
    font-weight: 600 !important;
    /* G�NCELLENDI: Dikey 4px, Yatay 20px */
    padding: 4px 20px !important; 
    border-bottom: 2px solid #d0d4e4 !important;
    vertical-align: middle !important;
    text-transform: capitalize !important;
}

/* Satir Genel Ayarlari */
.k-grid-content tr {
    background-color: #fff !important;
    border-bottom: 1px solid #e6e9ef !important;
}

/* Satir Hover Efekti */
.k-grid-content tr:hover {
    background-color: #f5f6f8 !important;
}

/* Veri H�creleri (Data Cells) */
.k-grid-content td {
    border-style: none !important; 
    border-bottom: 1px solid #e6e9ef !important; 
    /* G�NCELLENDI: Dikey 4px, Yatay 20px */
    padding: 4px 20px !important; 
    vertical-align: middle !important;
    line-height: 1.5 !important;
    font-weight: 400 !important; 
}

/* Se�ili Satir Ayarlari */
.k-grid tr.k-state-selected,
.k-grid td.k-state-selected {
    background-color: #e5f4ff !important; 
}

/* Alt Sayfalama (Pager) Alani */
.k-pager-wrap, .k-grid-pager {
    background-color: #fff !important;
    border-top: 1px solid #d0d4e4 !important;
    color: #676879 !important;
    border-radius: 0 0 8px 8px !important;
}

/* Sayfalama Numaralari */
.k-pager-numbers .k-link.k-state-selected {
    background-color: #0073ea !important;
    color: #fff !important;
    border-radius: 50% !important;
}




/* Ana Pencere ve Form Kapsayicisi */
#FrmExecNewForm_Form_1,
.xpodarightform,
.k-window-content,
.k-window-iframecontent {
    background-color: #ffffff !important;
}

/* Iframe'in Kendisi */
.k-content-frame {
    background-color: #ffffff !important;
}

/* Eger iframe i�inden gelen bir g�vde rengi varsa */
body {
    background-color: #ffffff !important;
}
/* =========================================================
   Textbox (Kendo TextBox & TextArea) — Xpoda Tasarımı
   Buton ve dropdown sistemiyle aynı palet ve ölçüler kullanılır.
   Bu dosyayı Xpoda'ya ekleyin; mevcut TextBox ve TextArea
   markup'ı otomatik olarak etkilenir.
   ========================================================= */

:root {
  --tb-blue-600: #2563eb;
  --tb-blue-700: #1d4ed8;
  --tb-blue-100: #dbeafe;
  --tb-blue-50:  #eff6ff;
  --tb-slate-900: #0f172a;
  --tb-slate-700: #334155;
  --tb-slate-600: #475569;
  --tb-slate-500: #64748b;
  --tb-slate-400: #94a3b8;
  --tb-slate-300: #cbd5e1;
  --tb-slate-200: #e2e8f0;
  --tb-slate-100: #f1f5f9;
  --tb-slate-50:  #f8fafc;
  --tb-radius: 6px;
  --tb-height: 36px;
  --tb-font-size: 12.5px;
}

/* ---------- TextBox (Giriş kutusu) ---------- */
span.k-input:is(.k-textbox, .k-textarea) {
  border: 1px solid var(--tb-slate-300) !important;
  border-radius: var(--tb-radius) !important;
  background: #fff !important;
  box-shadow: none !important;
  display: inline-flex !important;
  align-items: center !important;
  overflow: hidden !important;
  transition: border-color 0.13s ease, box-shadow 0.13s ease !important;
  box-sizing: border-box !important;
}

span.k-input.k-textbox {
  height: var(--tb-height) !important;
}

span.k-input.k-textarea {
  min-height: 80px !important;
  height: auto !important;
  padding: 8px 0 !important;
  align-items: flex-start !important;
}

span.k-input:is(.k-textbox, .k-textarea):hover {
  border-color: var(--tb-slate-400) !important;
}

span.k-input:is(.k-textbox, .k-textarea):focus-within {
  border-color: var(--tb-blue-600) !important;
  box-shadow: 0 0 0 3px var(--tb-blue-100) !important;
}

/* ---------- İç Input Alanı ---------- */
:is(.k-textbox, .k-textarea) .k-input-inner {
  border: none !important;
  outline: none !important;
  background: transparent !important;
  padding: 0 12px !important;
  font-family: inherit !important;
  font-size: var(--tb-font-size) !important;
  color: var(--tb-slate-700) !important;
  min-width: 0 !important;
  flex: 1 !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
}

span.k-input.k-textarea .k-input-inner {
  resize: vertical !important;
  min-height: 64px !important;
  padding: 0 12px !important;
}

:is(.k-textbox, .k-textarea) .k-input-inner::placeholder {
  color: var(--tb-slate-400) !important;
}

/* ---------- Devre Dışı Durumu ---------- */
span.k-input:is(.k-textbox, .k-textarea).k-disabled,
span.k-input:is(.k-textbox, .k-textarea)[aria-disabled="true"] {
  opacity: 0.55 !important;
  background: var(--tb-slate-50) !important;
  cursor: not-allowed !important;
}

span.k-input:is(.k-textbox, .k-textarea).k-disabled .k-input-inner {
  cursor: not-allowed !important;
}