/* ============================================================================
   ZekiKod PDKS — Metronic 9 görünümü: RENK VURGULARI + TEMA DÜĞMESİ (mt-accents.css)
   ----------------------------------------------------------------------------
   En son yüklenir. Üç iş yapar:
     1) Anlamsal renklendirme: menü gruplarının ikonları kendi renginde
        (Metronic'in renkli "duotone" ikonları gibi), araç çubuğunda "Yeni"
        ana renk, "Sil" ve geri alınamaz özel eylemler (mt-eylem-tehlike)
        kırmızı vurgulu.
     2) Açık / koyu tema düğmesi (#mt-theme-toggle, js/mt-theme.js ekler).
     3) Koyu temaya özgü küçük düzeltmeler (logo, .bg-white ...).
   Renkler yalnız --mt-* token'larından gelir; koyu temada token'lar
   değiştiği için ayrıca yazılmaz.
   ============================================================================ */

/* ============================================================================
   1a) MENÜ GRUBU İKONLARI — ikon adına göre renk
   Grup sırası lisansa göre değişebildiği için sıra (nth-child) değil,
   XAF'ın ikon adresi (IImageService/<Ad>) kullanılır. Yalnız kök seviyedeki
   ikonlar renklenir; alt menülerde ikon zaten gösterilmiyor. Eşlenmeyen
   kök ikonlar ana renk alır.
   ============================================================================ */
#main-window-template-component .xaf-navmenu .xaf-nav-item.has-children > .dxbl-accordion-group-header img.xaf-nav-menu-item-icon,
#main-window-template-component .dxbl-accordion-container > .dxbl-accordion-items-container > .xaf-nav-item.clickable-xaf-nav-item > a.dxbl-accordion-item-content img.xaf-nav-menu-item-icon {
    /* renk değişkeni burada ATANMAZ: bu seçici (1,5,1) aşağıdaki ikon adına göre
       renk kurallarından (1,3,1) güçlü olduğu için hepsini ana renge eziyordu */
    filter: var(--mt-nav-icon, var(--mt-icon-filter-primary));
}
#main-window-template-component .xaf-navmenu img.xaf-nav-menu-item-icon[src*="ImageService/BO_Employee?"],
#main-window-template-component .xaf-navmenu img.xaf-nav-menu-item-icon[src*="ImageService/Actions_User?"],
#main-window-template-component .xaf-navmenu img.xaf-nav-menu-item-icon[src*="ImageService/BO_Customer?"],
#main-window-template-component .xaf-navmenu img.xaf-nav-menu-item-icon[src*="ImageService/BO_User?"] {
    --mt-nav-icon: var(--mt-icon-filter-info);
}
#main-window-template-component .xaf-navmenu img.xaf-nav-menu-item-icon[src*="ImageService/BO_Scheduler?"],
#main-window-template-component .xaf-navmenu img.xaf-nav-menu-item-icon[src*="ImageService/Travel_Restaurant?"],
#main-window-template-component .xaf-navmenu img.xaf-nav-menu-item-icon[src*="ImageService/Actions_Clock?"],
#main-window-template-component .xaf-navmenu img.xaf-nav-menu-item-icon[src*="ImageService/Travel_Beach?"] {
    --mt-nav-icon: var(--mt-icon-filter-warning);
}
#main-window-template-component .xaf-navmenu img.xaf-nav-menu-item-icon[src*="ImageService/Business_Calculator?"],
#main-window-template-component .xaf-navmenu img.xaf-nav-menu-item-icon[src*="ImageService/BO_Organization?"],
#main-window-template-component .xaf-navmenu img.xaf-nav-menu-item-icon[src*="ImageService/Business_Money?"],
#main-window-template-component .xaf-navmenu img.xaf-nav-menu-item-icon[src*="ImageService/BO_Contract?"] {
    --mt-nav-icon: var(--mt-icon-filter-success);
}
#main-window-template-component .xaf-navmenu img.xaf-nav-menu-item-icon[src*="ImageService/Security_Lock?"],
#main-window-template-component .xaf-navmenu img.xaf-nav-menu-item-icon[src*="ImageService/Security_Fingerprint?"] {
    --mt-nav-icon: var(--mt-icon-filter-danger);
}
#main-window-template-component .xaf-navmenu img.xaf-nav-menu-item-icon[src*="ImageService/BO_Security_Permission?"],
#main-window-template-component .xaf-navmenu img.xaf-nav-menu-item-icon[src*="ImageService/Settings?"] {
    --mt-nav-icon: var(--mt-icon-filter-strong);
}
/* Üzerine gelince / etkin: ikon kendi renginde kalır, başlık ana renge
   döner (mt-shell); ikonu biraz öne çıkarmak için hafif büyütme yok,
   yalnız tam opaklık. */
#main-window-template-component .xaf-navmenu .xaf-nav-item.has-children > .dxbl-accordion-group-header:hover img.xaf-nav-menu-item-icon,
#main-window-template-component .dxbl-accordion-container > .dxbl-accordion-items-container > .xaf-nav-item.clickable-xaf-nav-item > a.dxbl-accordion-item-content:hover img.xaf-nav-menu-item-icon,
#main-window-template-component .dxbl-accordion-container > .dxbl-accordion-items-container > .xaf-nav-item.clickable-xaf-nav-item.dxbl-active > a.dxbl-accordion-item-content img.xaf-nav-menu-item-icon {
    filter: var(--mt-nav-icon, var(--mt-icon-filter-primary));
}

/* ============================================================================
   1b) ARAÇ ÇUBUĞU — anlamsal düğme renkleri
   XAF düğmeye eylemin başlığını data-action-name olarak yazıyor (kimlik
   değil); Türkçe ve İngilizce başlıklar birlikte eşlenir. Görünen düğme ile
   __virtual ölçüm ikizi aynı özniteliği taşır, ikisi de aynı stili alır.
   ============================================================================ */
/* "Yeni" -> Metronic birincil düğme (mavi zemin, beyaz ikon/metin) */
/* DevExpress araç çubuğu düğme rengini ".dxbl-toolbar > .dxbl-btn-toolbar
   .dxbl-toolbar-btn.dxbl-btn.dxbl-btn-secondary" (5 sınıf) ile veriyor;
   aynı zinciri + öznitelik kullanarak (6) geçiyoruz. */
.dxbl-toolbar .dxbl-btn-toolbar .dxbl-toolbar-btn.dxbl-btn.dxbl-btn-secondary[data-action-name="Yeni"],
.dxbl-toolbar .dxbl-btn-toolbar .dxbl-toolbar-btn.dxbl-btn.dxbl-btn-secondary[data-action-name="New"] {
    --dxbl-btn-bg: var(--mt-primary);
    --dxbl-btn-color: var(--mt-primary-fg);
    --dxbl-btn-border-color: var(--mt-primary);
    --dxbl-btn-hover-bg: var(--mt-primary-hover);
    --dxbl-btn-hover-color: var(--mt-primary-fg);
    --dxbl-btn-hover-border-color: var(--mt-primary-hover);
    --dxbl-btn-active-bg: var(--mt-primary-active);
    --dxbl-btn-active-color: var(--mt-primary-fg);
    --dxbl-btn-active-border-color: var(--mt-primary-active);
}
.dxbl-btn.dxbl-toolbar-btn[data-action-name="Yeni"] img,
.dxbl-btn.dxbl-toolbar-btn[data-action-name="New"] img,
.dxbl-btn.dxbl-toolbar-btn[data-action-name="Yeni"]:hover img,
.dxbl-btn.dxbl-toolbar-btn[data-action-name="New"]:hover img {
    filter: var(--mt-icon-filter-white);
}
/* "Sil" ve geri alınamaz özel eylemler (Model.xafml CustomCSSClassName
   "mt-eylem-tehlike", ör. "Kayıt Belleğini Sıfırla") -> kırmızı ikon/metin;
   üzerine gelince açık kırmızı zemin (Metronic "destructive" outline).
   Devre dışıyken solukluk mt-controls'tan gelir. */
.dxbl-btn.dxbl-toolbar-btn[data-action-name="Sil"] img,
.dxbl-btn.dxbl-toolbar-btn[data-action-name="Delete"] img,
.dxbl-btn.dxbl-toolbar-btn.mt-eylem-tehlike img,
.dxbl-btn.dxbl-toolbar-btn[data-action-name="Sil"]:hover img,
.dxbl-btn.dxbl-toolbar-btn[data-action-name="Delete"]:hover img,
.dxbl-btn.dxbl-toolbar-btn.mt-eylem-tehlike:hover img {
    filter: var(--mt-icon-filter-danger);
}
.dxbl-toolbar .dxbl-btn-toolbar .dxbl-toolbar-btn.dxbl-btn.dxbl-btn-secondary[data-action-name="Sil"],
.dxbl-toolbar .dxbl-btn-toolbar .dxbl-toolbar-btn.dxbl-btn.dxbl-btn-secondary[data-action-name="Delete"],
.dxbl-toolbar .dxbl-btn-toolbar .dxbl-toolbar-btn.dxbl-btn.dxbl-btn-secondary.mt-eylem-tehlike {
    --dxbl-btn-color: var(--mt-danger-text);
    --dxbl-btn-hover-bg: var(--mt-danger-light);
    --dxbl-btn-hover-color: var(--mt-danger-text);
    --dxbl-btn-hover-border-color: var(--mt-danger-light-border);
}
/* Yenile / Dışa aktar -> hafif renkli ikon (Metronic "light" düğme hissi) */
.dxbl-btn.dxbl-toolbar-btn[data-action-name="Yenile"] img,
.dxbl-btn.dxbl-toolbar-btn[data-action-name="Refresh"] img {
    filter: var(--mt-icon-filter-primary);
}
.dxbl-btn.dxbl-toolbar-btn[data-action-name="Dışa Aktar"] img,
.dxbl-btn.dxbl-toolbar-btn[data-action-name="Export"] img,
.dxbl-btn.dxbl-toolbar-btn[data-action-name="Export to"] img {
    filter: var(--mt-icon-filter-success);
}

/* Satır içi eylemler (liste satırındaki küçük ikonlar): hover'da ana renk */
.dxbl-grid td.dxbl-grid-command-cell .xaf-inline-action:hover img {
    filter: var(--mt-icon-filter-primary);
}

/* ============================================================================
   2) AÇIK / KOYU TEMA DÜĞMESİ (js/mt-theme.js üst çubuğa ekler)
   ============================================================================ */
#mt-theme-toggle {
    order: -1;                       /* hesap avatarının soluna */
    width: 34px;
    height: 34px;
    margin-right: 8px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    align-self: center;
    border: 0;
    border-radius: var(--mt-radius-sm);
    background: transparent;
    color: var(--mt-fg-muted);
    cursor: pointer;
    transition: background-color var(--mt-transition), color var(--mt-transition);
}
#mt-theme-toggle:hover {
    background: var(--mt-accent);
    color: var(--mt-fg);
}
#mt-theme-toggle:focus-visible {
    outline: 2px solid rgba(var(--mt-primary-rgb), .45);
    outline-offset: 1px;
}
#mt-theme-toggle svg {
    width: 18px;
    height: 18px;
}
#mt-theme-toggle .mt-ico-sun { display: none; }
:root.dark #mt-theme-toggle .mt-ico-sun { display: block; }
:root.dark #mt-theme-toggle .mt-ico-moon { display: none; }

/* ============================================================================
   3) KOYU TEMA DÜZELTMELERİ
   ============================================================================ */
/* Beyaz logo (üst çubuk + giriş sayfası) */
:root.dark #main-window-template-component .header-logo,
:root.dark #logon-template-component .header-logo {
    background-image: url('../../images/sentez-yatay-beyaz.svg');
}
/* Bootstrap 5.3'ün .card, .bg-body, .bg-light, .text-dark, .border
   yardımcıları --bs-* değişkenlerinden okuduğu için koyu temaya kendiliğinden
   uyar (mt-tokens.css). Yalnız .bg-white sabit beyazdır: eski sayfalarda
   yüzey olarak kullanıldığından koyu temada yüzey rengine çekilir. */
:root.dark .bg-white {
    background-color: var(--mt-bg) !important; /* Bootstrap .bg-white !important taşıyor */
}
/* Yerel denetimlerin (select, date, scrollbar) koyu çizimi */
:root.dark input,
:root.dark select,
:root.dark textarea {
    color-scheme: dark;
}

/* ============================================================================
   4) BİRİNCİL VE ÖNEMLİ EYLEMLER HER ZAMAN METİNLİ ("+ Yeni", "Kaydet", ...)
   DevExpress'in uyarlanabilir araç çubuğu yer daralınca bütün düğmeleri
   yalnız-ikon durumuna alıyor (metin span'i display:none). Metronic'te birincil
   eylem her zaman etiketli olduğu için bu iki tür düğmede metin korunur.
   DevExpress yalnız-ikon genişliğini gerçek düğmeden metin span'ini çıkararak
   hesaplar (GF.getNoTextWidth). Burada zorla açılan metin taşma hesabına
   girmez; bu sınıfı yalnız yeri bol araç çubuklarında kullan.

   Önemli/tehlikeli özel eylemler (Kapıyı Aç, Kayıt Belleğini Sıfırla,
   Otomatik Planla (AI), Durum) Blazor Model.xafml > ActionDesign'da
   CustomCSSClassName="mt-eylem-metinli" ile işaretli; XAF sınıfı
   DxToolbarItem CssClass'ına yazar (xaf-primary-toolbar-btn ile aynı yol).
   Açılır düğmede sınıf sarmalayıcıya düşerse "> .dxbl-btn" seçicisi tutar.
   ============================================================================ */
.dxbl-toolbar .dxbl-btn.xaf-primary-toolbar-btn > .dxbl-image + span,
.dxbl-toolbar .dxbl-btn.mt-eylem-metinli > .dxbl-image + span,
.dxbl-toolbar .mt-eylem-metinli > .dxbl-btn > .dxbl-image + span,
.dxbl-toolbar .dxbl-btn[data-action-name="Yeni"] > .dxbl-image + span,
.dxbl-toolbar .dxbl-btn[data-action-name="New"] > .dxbl-image + span {
    display: inline !important; /* DevExpress yalnız-ikon durumu metni !important olmadan çok sınıflı zincirle gizliyor */
}
.dxbl-toolbar .dxbl-btn.xaf-primary-toolbar-btn:has(> .dxbl-image + span),
.dxbl-toolbar .dxbl-btn.mt-eylem-metinli:has(> .dxbl-image + span),
.dxbl-toolbar .mt-eylem-metinli > .dxbl-btn:has(> .dxbl-image + span),
.dxbl-toolbar .dxbl-btn[data-action-name="Yeni"]:has(> .dxbl-image + span),
.dxbl-toolbar .dxbl-btn[data-action-name="New"]:has(> .dxbl-image + span) {
    width: auto !important;     /* mt-controls'taki 34px kare ikon düğmesi kuralını bu düğmelerde iptal eder */
    padding-left: 12px !important;
    padding-right: 14px !important;
    gap: 6px;
}

/* ============================================================================
   5) DETAY: SEKME DENETİMİ KART + YAPIŞKAN ŞERİT
   Sekme denetimi kart yüzeyine oturur (ZekiKodOkul'da detay sekmeleri
   kartın içindedir). Uzun formlarda kaydırınca sekme şeridi görünür kalır
   (içerik .main-content içinde kayıyor; şerit üst kenara yapışır).
   ============================================================================ */
#main-view-content .detail-view-content .dxbl-fl-gt > .dxbl-tabs {
    background: var(--mt-bg);
    border-radius: var(--mt-radius-lg);
    box-shadow: var(--mt-shadow-sm);
}
/* Sekme kartının içindeki grup kartları düz bölüm olur (şartname 3.6-1, 5.2-3): aynı zeminde ikinci gölge
   dış kart kenarında üst üste biniyordu. Bölüm ayrımını başlığın alt çizgisi verir. */
#main-view-content .detail-view-content .dxbl-fl-gt .dxbl-fl-gd > .dxbl-group.dxbl-group {
    box-shadow: none;
}
#main-view-content .detail-view-content .dxbl-fl-gt > .dxbl-tabs > .dxbl-tabs-tablist {
    position: sticky;
    top: 0;
    z-index: 6;
    background: var(--mt-bg);
    border-top-left-radius: var(--mt-radius-lg);
    border-top-right-radius: var(--mt-radius-lg);
}
/* Başlıksız alan grubu + sekme kartı (ör. Rol): E4 (mt-data.css) .dxbl-fl-gt'li formları dışlıyor, E4c de
   yalnız .dxbl-fl-gd'li formlara uygulanıyor. Grubun iç satırı sekme kartıyla aynı yüzeye alınır. */
#main-view-content .detail-view-content > .dxbl-fl:not(:has(.dxbl-fl-gd, label.xaf-item-sayfa)) .dxbl-row > .dxbl-fl-group:not(.dxbl-fl-gd):not(.dxbl-fl-gt):has(> .dxbl-row > .dxbl-fl-item > label.dxbl-fl-cpt):has(~ .dxbl-fl-gt) > .dxbl-row {
    margin: 0;
    padding: 16px 14px;
    background: var(--mt-bg);
    border-radius: var(--mt-radius-lg);
    box-shadow: var(--mt-shadow-sm);
}

/* ============================================================================
   6) YÜZEN ASİSTAN DÜĞMESİYLE ÇAKIŞMA
   #zk-asistan-dugme sağ altta sabit (22px + 52px). Ana listede sayfalayıcının
   sağındaki sayfa boyutu seçicisi, detayda ise en alttaki alanlar/düğmeler
   onun altında kalıyordu. Düğme varken:
     - ana liste sayfalayıcısı sağdan düğme kadar boşluk bırakır,
     - detay içeriği altta kaydırma payı alır (son alan düğmenin üstüne çıkabilir).
   ============================================================================ */
body:has(#zk-asistan-dugme) #main-view-content > .main-content > .grid-content .dxbl-grid-bottom-panel.dxbl-pager-container,
body:has(#zk-asistan-dugme) #main-view-content > .main-content > .dxbl-grid .dxbl-grid-bottom-panel.dxbl-pager-container {
    padding-right: 64px;
}
body:has(#zk-asistan-dugme) #main-view-content .detail-view-content {
    padding-bottom: 64px;
}
