/* ============================================================
   MODERN GRID - TAM CSS (Title + Sətirlər + Hover)
   ============================================================ */

/* 1. Başlıq Hissəsi (Header Container) */
.modern-grid .x-column-header {
    background: #f8fafc !important;
    border-bottom: 2px solid #e2e8f0 !important; /* Alt xətt daha aydın */
    border-right: 1px solid #f1f5f9 !important;
    height: 42px !important;    /* Yazıların nəfəs alması üçün ideal ölçü */
    padding: 0 !important;       /* Padding-i sıfırlayırıq ki, mərkəzləmə tam olsun */
    vertical-align: middle !important;
}

/* 2. Başlıq Daxili Yazı və İkonlar - TAM MƏRKƏZLƏMƏ */
.modern-grid .x-column-header-inner {
    display: flex !important;
    align-items: center !important;    /* Şaquli (Y oxu) tam mərkəz */
    justify-content: center !important; /* Üfüqi (X oxu) tam mərkəz */
    height: 100% !important;           /* Başlığın bütün hündürlüyünü əhatə edir */
    color: #475569 !important;         /* Tünd boz yazı */
    font-weight: 700 !important;
    font-size: 13px !important;
    line-height: 1 !important;         /* Yazının aşağı qaçmasının qarşısını alır */
    text-align: center !important;
}

/* 3. Mouse üzərinə gələndə (Hover) - Yazının itməməsi üçün */
.modern-grid .x-column-header-over {
    background: #f1f5f9 !important;    /* Yüngül boz fon */
}

.modern-grid .x-column-header-over .x-column-header-inner {
    color: #1e293b !important;         /* Mouse gələndə yazı rəngi daha da tündləşir */
}

/* 4. Sətir daxili boşluqlar (Sənin bəyəndiyin hissə) */
.modern-grid .x-grid-cell {
    padding: 6px 8px !important;
    font-size: 12px !important;
    line-height: 16px !important;
    vertical-align: middle !important;
}

/* 5. Grid-in ümumi çərçivəsi */
.modern-grid {
    border: 1px solid #d1d5db !important;
    border-radius: 6px !important;
}

/* 6. Seçilmiş sətir (Yaşıl vurğu - JPEG-dəki kimi) */
.modern-grid .x-grid-item-selected {
    background-color: #f0fdf4 !important; /* Mint Green */
    border-color: #bbf7d0 !important;
}

.modern-grid .x-grid-item-selected .x-grid-cell {
    color: #166534 !important; /* Tünd yaşıl yazı */
    font-weight: 500 !important;
}

/* 7. Şaquli Xətləri Yumşaltmaq */
.modern-grid .x-grid-with-col-lines .x-grid-cell {
    border-right: 1px solid #f1f5f9 !important;
}

/* 8. Sıralama (Sort) oxu və Trigger düymələri */
.modern-grid .x-column-header-trigger {
    background-color: transparent !important;
    border: none !important;
}

.modern-grid .x-column-header-sort-asc, 
.modern-grid .x-column-header-sort-desc {
    background-color: #f1f5f9 !important; /* Aktiv sütunun başlığını vurğula */
}