/* =============================================================================
   HKU KYS — ÜÇÜNCÜ TARAF CSS ÜZERİNE YAZAN KATMAN
   -----------------------------------------------------------------------------
   🔴 NEDEN AYRI DOSYA (2026-09-18'de ölçüldü):
   Sayfadaki stil sırası şöyle:
       0-10  bizim dosyalarımız (head)
       11    tom-select.bootstrap5.min.css      (head, bizden SONRA)
       12-13 dataTables/buttons.bootstrap5      (_DataTablesAssets, GÖVDEDE)
   Yani satıcı CSS'i her zaman bizden sonra geliyor ve EŞİT özgüllükte kazanıyor.
   Bunu tek tek `!important` ya da özgüllük yarışıyla çözmek, her yeni satıcı
   kuralında tekrar kırılan bir oyun olurdu.

   ÇÖZÜM: bu dosya <body> SONUNDA yüklenir — kaynak sırası bakımından her satıcı
   CSS'inden sonradır, bu yüzden NORMAL özgüllükle kazanır. Buraya yalnızca
   "satıcı varsayılanını HKU tokenına bağlayan" kurallar yazılır.

   ⚠️ Buraya tasarım YAZILMAZ; tasarım hku-modern.css'te durur. Burası sadece
      "üçüncü taraf ne diyorsa bizim tokenımıza çevir" katmanıdır.
   ============================================================================= */

/* --- Tom Select: arama özellikli dropdown --- */
.ts-wrapper .ts-control,
.ts-wrapper.single .ts-control,
.ts-wrapper.multi .ts-control {
    border: 1px solid var(--hku-input);
    border-radius: var(--hku-radius-sm);
    background-color: var(--hku-input-bg);
    color: var(--hku-text);
}
.ts-wrapper.single .ts-control:hover,
.ts-wrapper.multi .ts-control:hover { border-color: var(--hku-border-hover); }
.ts-wrapper.focus .ts-control {
    border-color: var(--hku-primary);
    box-shadow: 0 0 0 3px var(--hku-primary-tint);
}
.ts-dropdown {
    border: 1px solid var(--hku-border);
    border-radius: var(--hku-radius-sm);
    box-shadow: var(--hku-shadow-md);

    /* 🔴 KATMAN: acilir liste blade panelinin USTUNDE olmak zorunda.
       Tom Select listeyi dropdownParent:'body' ile <body>'ye tasir (cunku
       .hku-card overflow:hidden onu keser), yani blade'in cocugu DEGILDIR;
       onu gorunur kilan tek sey z-index sirasidir.
       Olcum (2026-09-25, canli): tom-select kendi CSS'inde 1000 veriyor, blade
       katmani 1085 -> liste aciliyor ama panelin ARKASINDA kaliyordu; 7 modulun
       blade formunda "secenek yok" gorunuyordu.
       ⚠️ Kural bu dosyada durur: tom-select CSS'i hku-modern.css'ten SONRA
       yuklendigi icin oradaki ayni ozgullukteki kural KAYBEDIYOR. */
    z-index: var(--hku-z-dropdown);
}
.ts-dropdown .active { background: var(--hku-primary-tint); color: var(--hku-text); }

/* --- DataTables: kendi ürettiği arama / sayfa boyutu / sayfalama --- */
.dt-container .form-control-sm,
.dt-container .form-select-sm {
    border: 1px solid var(--hku-input);
    border-radius: var(--hku-radius-sm);
    background-color: var(--hku-input-bg);
    color: var(--hku-text);
}
.dt-container .form-control-sm:focus,
.dt-container .form-select-sm:focus {
    border-color: var(--hku-primary);
    box-shadow: 0 0 0 3px var(--hku-primary-tint);
    outline: 0;
}
.dt-container .page-link {
    border-color: var(--hku-border);
    color: var(--hku-text);
    border-radius: var(--hku-radius-sm);
    margin: 0 2px;
}
.dt-container .page-link:hover {
    background: var(--hku-bg-soft);
    border-color: var(--hku-border-hover);
    color: var(--hku-text);
}
.dt-container .page-item.active .page-link {
    background: var(--hku-primary);
    border-color: var(--hku-primary);
    color: #fff;
}
.dt-container .page-item.disabled .page-link {
    color: var(--hku-text-muted);
    border-color: var(--hku-line);
    background: transparent;
}

/* --- Tom Select YÜKSEKLİĞİ: yerini aldığı <select> ile aynı olmalı ---
   🔴 Ölçüldü (canlı /Risk/Liste filtre satırı): yan yana duran kontrollerden
   normal <select> 32px iken Tom Select sarmalayıcısı 40px'ti — 8px fark, aynı
   satırda gözle görülür hizasızlık.
   Sözleşme (hku-modern.css): .hku-form .form-control/.form-select = 36px/.875rem,
   ...-sm = 32px/.8rem. Sarmalayıcı 1px+1px kenarlık eklediği için iç .ts-control
   2px daha kısa ayarlanır. */
.ts-wrapper.form-select .ts-control {
    min-height: 34px;
    padding: .3rem 2.2rem .3rem .6rem;   /* sağ: temizle/ok düğmeleri için yer */
    font-size: .875rem;
}
.ts-wrapper.form-select-sm .ts-control {
    min-height: 30px;
    padding: .25rem 2rem .25rem .5rem;
    font-size: .8rem;
}
.ts-wrapper.form-select,
.ts-wrapper.form-select-sm { padding: 0; min-height: 0; height: auto; }

/* Filtre çubuğunda TÜM kontroller küçük boyuttadır (partial'lar `form-select-sm`
   üretir) ama LookupSelect bileşeni `form-select` veriyor -> Tom Select 36px,
   komşuları 32px kalıyordu. Bağlamı CSS'te eşitliyoruz; 33 view'daki markup'a
   dokunmaya gerek yok. */
.hku-filter-card .ts-wrapper.form-select .ts-control {
    min-height: 30px;
    padding: .25rem 2rem .25rem .5rem;
    font-size: .8rem;
}

/* --- Filtre satırında dikey hizalama ---
   🔴 Ölçüldü: LookupSelect bileşeni kontrolünü `.mb-3` sarmalayıcı içinde veriyor
   (16px alt boşluk). Filtre satırı `align-items-end` olduğu için o alan komşularından
   16px YUKARI kayıyordu (Birim 310px, diğerleri 326px). Filtre çubuğunda alanlar tek
   satırda hizalanır; oradaki dikey boşluk anlamsızdır.
   `!important` gerekli: Bootstrap'in `.mb-3` yardımcısı da `!important` taşıyor. */
.hku-filter-card .mb-3,
.hku-filter-card .mb-2 { margin-bottom: 0 !important; }

/* =============================================================================
   PANOLAR — Bootstrap `.card` panelleri HKU panel diline bağlanır
   -----------------------------------------------------------------------------
   🔴 Ölçüldü (canlı /StratejikPlanAnalizi/Index): sayfada **30 Bootstrap `.card`**
   ile **1 `.hku-card`** yan yana duruyordu:
       Bootstrap kart : yarıçap 6px · gölge rgba(0,0,0,.075) · kenarlık #6c757d
       HKU kart       : yarıçap 10px · gölge rgba(16,33,56,.04) · kenarlık #dce2ea
   Yani aynı panoda İKİ AYRI PANEL DİLİ vardı. Liste sayfalarında kapatılan sorunun
   pano karşılığı budur.

   Sınıf dağılımı (ölçüldü): 20 × `card border shadow-sm border-secondary`,
   10 × `card border-0 shadow-sm`. `border-secondary` semantik bir vurgu DEĞİL,
   Bootstrap'in genel grisi — bu yüzden yeniden tonlamak bilgi kaybettirmez.

   ⚠️ Padding'e DOKUNULMADI: `.card-body` 8px (KPI kutularında bilinçli sıkılık);
   değiştirmek kutu yüksekliklerini ve ızgara düzenini kaydırırdı.
   ============================================================================= */
.hku-content .card:not(.hku-card) {
    border-radius: var(--hku-radius-lg);
    box-shadow: var(--hku-shadow-md);
    background-color: var(--hku-card);
}
/* `shadow-sm` Bootstrap yardımcısı `!important` taşıyor; gölge iki ayrı tonda
   kalmasın diye burada da gerekli (ölçüldü: rgba(0,0,0,.075) ↔ rgba(16,33,56,.04)). */
.hku-content .card:not(.hku-card).shadow-sm,
.hku-content .card:not(.hku-card).shadow { box-shadow: var(--hku-shadow-md) !important; }
/* `border-secondary` / `border` yardımcıları `!important` taşıdığı için burada da gerekli. */
.hku-content .card:not(.hku-card).border,
.hku-content .card:not(.hku-card).border-secondary {
    border-color: var(--hku-card-border) !important;
}

/* Ana sayfadaki hızlı erişim kutuları KPI kutularıyla aynı yarıçapta olsun
   (ölçüldü: hızlı erişim 8px, KPI ve kartlar 10px). */
.hku-quick-grid > * { border-radius: var(--hku-radius-lg); }
