/* --- 1. GENEL XAF LAYOUT AYARLARI --- */
html,
body {
    height: 100%;
}

app {
    display: block;
    height: 100%;
}

.header-logo {
    flex-shrink: 0;
    background-color: currentColor;
    -webkit-mask: url('../images/Logo.svg');
    mask: url('../images/Logo.svg');
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    width: 28px;
    height: 24px;
}

#blazor-error-ui {
    background: inherit;
    bottom: 0;
    display: none;
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 100001;
}

/* --- 2. KOMPDETAY_LISTVIEW2 (SATIŞ VİTRİNİ) ÖZEL GÖRÜNÜMÜ --- */
/* Controller üzerinden atanan 'ozel-vitrin-grid' sınıfı tetiklendiğinde çalışır */

/* Ana tabloyu flexbox yapısına çeker */
.ozel-vitrin-grid .dxbl-grid-table,
.ozel-vitrin-grid div.xaf-view-content table {
    display: flex !important;
    flex-wrap: wrap !important;
    border: none !important;
    background: transparent !important;
}

/* Tablo başlıklarını (Header) kaldırır */
.ozel-vitrin-grid .dxbl-grid-table thead {
    display: none !important;
}

/* Satırları yan yana dizen kapsayıcı */
.ozel-vitrin-grid .dxbl-grid-table tbody {
    display: flex !important;
    flex-wrap: wrap !important;
    flex-direction: row !important;
    gap: 20px !important;
    padding: 20px !important;
    width: 100% !important;
}

/* Her bir ürünü (Satırı) karta çevirir */
.ozel-vitrin-grid .dxbl-grid-table tr {
    display: flex !important;
    flex-direction: column !important;
    width: 260px !important;
    min-height: 320px !important;
    border: 1px solid #e0e0e0 !important;
    border-radius: 12px !important;
    background-color: #ffffff !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08) !important;
    margin: 0 !important;
    overflow: hidden !important;
    transition: all 0.3s ease !important;
}

/* Kartın üzerine gelince vurgulama */
.ozel-vitrin-grid .dxbl-grid-table tr:hover {
    transform: translateY(-5px) !important;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15) !important;
    border-color: #007bff !important;
}

/* Hücreleri (Resim, İsim, Fiyat) dikey olarak hizalar */
.ozel-vitrin-grid .dxbl-grid-table td {
    border: none !important;
    display: block !important;
    text-align: center !important;
    padding: 12px !important;
    width: 100% !important;
}

/* Ürün Resim Ayarı */
.ozel-vitrin-grid .xaf-component-image,
.ozel-vitrin-grid .dxbl-grid-table td img {
    max-width: 100% !important;
    height: 160px !important;
    object-fit: contain !important;
    border-radius: 8px !important;
    margin: 0 auto !important;
}

/* Fiyat Alanı Vurgusu (Son Sütun) */
.ozel-vitrin-grid .dxbl-grid-table td:last-child {
    font-size: 1.4rem !important;
    font-weight: bold !important;
    color: #2e7d32 !important;
    margin-top: auto !important;
    padding-bottom: 20px !important;
}

/* --- 3. DİNAMİK RENKLENDİRME (VbRenklendirmeController) --- */
/* Kritik Değer (Limit Altı) - Hem kutucuk hem de etiket kırmızı */
.critical-value input,
.critical-value .dxbl-fl-c,
/* Etiket (Label) - Bu önemli */
.critical-value .dxbl-fl-i

/* Editor (Input) */
    {
    background-color: salmon !important;
    color: black !important;
}

/* İdeal Değer (Limit Üstü/Eşit) - Hem kutucuk hem de etiket yeşil */
.ideal-value input,
.ideal-value .dxbl-fl-c,
/* Etiket (Label) - Bu önemli */
.ideal-value .dxbl-fl-i {
    background-color: lightgreen !important;
    color: black !important;
}

/* --- 4. TEMİZ GÖRÜNÜM (CleanGroup) --- */
/* 
   AGGRESSIVE BORDER REMOVAL FOR NESTED GROUPS
   Forces transparency and removes borders/shadows from ALL container elements 
   within a CleanGroup, preventing the "stacked lines" effect.
*/
.CleanGroup,
.CleanGroup * {
    box-shadow: none !important;
}

/* Specifically target common container elements to remove borders */
.CleanGroup,
.CleanGroup .card,
.CleanGroup .dxbl-card,
.CleanGroup .dxbl-group-header,
.CleanGroup .dxbl-layout-group,
.CleanGroup .dxbl-fl-group,
.CleanGroup .dx-layout-item-wrapper,
.CleanGroup .dxbl-accordion-item,
.CleanGroup .dxbl-tab-item {
    border: none !important;
    outline: none !important;
    background-color: transparent !important;
    /* Prevents stacked colors looking like lines */
}

/* dxbl-fl-item (form layout item) transparent YAPILMIYOR */
/* Çünkü AppearanceController buraya salmon background koyuyor */
/* transparent !important bunu ezerek görünmez yapıyordu */
.CleanGroup .dxbl-fl-item {
    border: none !important;
    outline: none !important;
    /* background-color: transparent -- KALDIRILDI, renklendirme çalışsın */
}

/* Restore background for actual input editors so they don't disappear */
.CleanGroup input,
.CleanGroup textarea,
.CleanGroup select,
.CleanGroup .dxbl-editor,
.CleanGroup .dxbl-text-edit,
.CleanGroup .dxbl-memo-edit,
.CleanGroup .dxbl-spin-edit,
.CleanGroup .dxbl-date-edit,
.CleanGroup .dxbl-combobox {
    /* background-color kaldırıldı - AppearanceController'ın salmon rengi ezilmesin */
    border: 1px solid var(--bs-border-color, #dee2e6) !important;
}

/* --- 5. KRİTİK DEĞER CSS OVERRIDE --- */
/* AppearanceApplied BackColor inline style olarak üst container'a yazılır */
/* Ama içindeki input kendi white background'u ile bunu örter */
/* Salmon RGB = rgb(250, 128, 114) - bunu üst container'dan cascade ediyoruz */
[style*="rgb(250, 128, 114)"] input,
[style*="rgb(250, 128, 114)"] .dxbl-spin-edit,
[style*="rgb(250, 128, 114)"] .dxbl-text-edit,
[style*="rgb(250, 128, 114)"] .dxbl-fl-c,
[style*="rgb(250, 128, 114)"] .dxbl-fl-i,
[style*="rgb(250, 128, 114)"] .dxbl-fl-e {
    background-color: rgb(250, 128, 114) !important;
}

/* critical-value CSS class ile de çalışsın */
.critical-value input,
.critical-value .dxbl-spin-edit,
.critical-value .dxbl-text-edit,
.critical-value .dxbl-fl-c,
.critical-value .dxbl-fl-i,
.critical-value .dxbl-fl-e {
    background-color: salmon !important;
    color: black !important;
}