/**
 * ==========================================
 * GRID / LAYOUT
 * Sayfa iskeleti, container ve içerik alanları
 * ==========================================
 */

/* ========== UYGULAMA İSKELETİ ========== */
.app-shell {
    display: flex;
    width: 100%;
    min-height: 100vh;
    position: relative;
}

/* ========== İÇERİK ALANI (Main Wrapper) ========== */
.yonetim-ui .app-content {
    /* Sidebar genişliği kadar boşluk bırak */
    margin-left: var(--by-sidebar-width);
    width: calc(100% - var(--by-sidebar-width));
    min-height: 100vh;
    
    display: flex;
    flex-direction: column;
    
    /* Topbar yüksekliği kadar yukarıdan boşluk */
    padding-top: var(--by-topbar-height);
    
    /* Animasyonlar */
    transition: margin-left var(--by-transition-slow), width var(--by-transition-slow);
    
    /* Arkaplan */
    background-color: var(--by-bg-body);
}

/* ========== SAYFA İÇERİĞİ (Actual Content) ========== */
.yonetim-ui main.content {
    flex: 1; /* Kalan tüm alanı kapla */
    padding: 20px;
    width: 100%;
    
    /* Dropdown menülerin kesilmemesi için visible olmalı */
    overflow: visible; 
}

/* ========== BY4 KANVAS (üst badge + alt flashcard aynı sol/sağ/üst padding) ========== */
.yonetim-ui.firmalar-page main.content,
.yonetim-ui.kisiler-page main.content,
.yonetim-ui.bina-kur-page main.content,
.yonetim-ui.kisi-excel-import-page main.content,
.yonetim-ui.odemeler-page main.content,
.yonetim-ui.odemeler-out-page main.content,
.yonetim-ui.personel-page main.content,
.yonetim-ui.property-page main.content,
.yonetim-ui.borclandirma-page main.content,
.yonetim-ui.toplu-borclandirma-page main.content,
.yonetim-ui.gelirler-page main.content,
.yonetim-ui.giderler-page main.content,
.yonetim-ui.bank-ekstre-page main.content,
.yonetim-ui.company-ekstre-page main.content,
.yonetim-ui.raporlar-page main.content {
    padding: var(--by4-page-padding) var(--by4-page-padding) var(--by4-page-padding-bottom) var(--by4-page-padding) !important;
    display: flex;
    flex-direction: column;
    min-height: 0;
    /* Uzun tabloda içerik yüksekliği flex ile kesilmesin; kaydırma ana içerikte */
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

/* Kişiler / Bağımsız: Bize Borçlu badge satırı topbar'a daha yakın */
.yonetim-ui.kisiler-page main.content,
.yonetim-ui.property-page main.content,
.yonetim-ui.bagimsiz-page.property-page main.content {
    padding-top: 10px !important;
}

/* BY4 sayfalarda yatay bosluk yalniz main.content kanvasindan gelsin. */
.yonetim-ui.firmalar-page main.content .container-fluid,
.yonetim-ui.kisiler-page main.content .container-fluid,
.yonetim-ui.bina-kur-page main.content .container-fluid,
.yonetim-ui.kisi-excel-import-page main.content .container-fluid,
.yonetim-ui.odemeler-page main.content .container-fluid,
.yonetim-ui.odemeler-out-page main.content .container-fluid,
.yonetim-ui.personel-page main.content .container-fluid,
.yonetim-ui.property-page main.content .container-fluid,
.yonetim-ui.borclandirma-page main.content .container-fluid,
.yonetim-ui.toplu-borclandirma-page main.content .container-fluid,
.yonetim-ui.gelirler-page main.content .container-fluid,
.yonetim-ui.giderler-page main.content .container-fluid {
    padding-left: 0;
    padding-right: 0;
    width: 100%;
    max-width: 100%;
}

/* ========== CONTAINER DÜZELTMELERİ ========== */
/* Bootstrap container'ını !important kullanmadan özelleştirme (BY4 dışı sayfalar) */
.yonetim-ui main.content .container-fluid {
    padding-left: 0;
    padding-right: 0;
    width: 100%;
    max-width: 100%;
}

/* Tablo sayfaları için tam genişlik */
.table-page-container {
    max-width: 100%;
    padding: 0;
}

/* ========== HEADER ALANI (Page Title) ========== */
.page-header {
    margin-bottom: 1.5rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap; /* Mobilde taşarsa aşağı insin */
    gap: 10px;
}

/* ========== GRİD YARDIMCILARI ========== */
.grid-2-col {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

/* ========== MOBİL UYUMLULUK (Responsive) ========== */
@media (max-width: 992px) {
    /* Mobilde sidebar gizlenince içerik tam ekran olsun */
    .yonetim-ui .app-content {
        margin-left: 0;
        width: 100%;
    }
    
    .yonetim-ui main.content {
        padding: 15px 10px; /* Mobilde padding'i biraz azalt */
    }
}

@media (max-width: 768px) {
    .grid-2-col {
        grid-template-columns: 1fr; /* Mobilde tek sütuna düş */
    }
}