/**
 * TailAdmin Layout Fix - Đảm bảo layout không bị lệch
 * Version: 1.0.1
 */

/* Ẩn sidebar trên trang settings */
body.settings-page-no-sidebar aside.tailadmin-sidebar,
body.settings-page-no-sidebar #tailadmin-sidebar,
body.settings-page-no-sidebar .tailadmin-sidebar {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    position: absolute !important;
    left: -9999px !important;
}

body.settings-page-no-sidebar .tailadmin-main-content {
    margin-left: 0 !important;
    width: 100% !important;
}

body.settings-page-no-sidebar .tailadmin-header {
    left: 0 !important;
    width: 100% !important;
}

body.settings-page-no-sidebar .tailadmin-menu-toggle,
body.settings-page-no-sidebar #tailadmin-sidebar-toggle {
    display: none !important;
}

/* Force full width và reset margins */
html, body {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow-x: hidden !important;
}

/* Đảm bảo body layout đúng */
body.with-tailadmin-layout {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow-x: hidden !important;
}

/* Sidebar fixed position */
.tailadmin-sidebar {
    position: fixed !important;
    left: 0 !important;
    top: 0 !important;
    width: var(--sidebar-width) !important;
    max-width: var(--sidebar-width) !important;
    z-index: 1000 !important;
}

/* Header fixed position */
.tailadmin-header {
    position: fixed !important;
    left: var(--sidebar-width) !important;
    top: 0 !important;
    width: calc(100% - var(--sidebar-width)) !important;
    max-width: calc(100% - var(--sidebar-width)) !important;
    margin: 0 !important;
    padding: 0 !important;
    z-index: 999 !important;
}

/* Main content đúng vị trí */
body.with-tailadmin-layout .tailadmin-main-content {
    margin-left: var(--sidebar-width) !important;
    margin-top: var(--header-height) !important;
    width: calc(100% - var(--sidebar-width)) !important;
    max-width: calc(100% - var(--sidebar-width)) !important;
    padding: 16px 32px 24px 32px !important;
    padding-top: 16px !important;
    box-sizing: border-box !important;
    position: relative !important;
    left: 0 !important;
    right: 0 !important;
    overflow-x: hidden !important;
}

/* Đảm bảo page container full width */
body.with-tailadmin-layout .page-container,
body.with-tailadmin-layout .pbn-master-section,
body.with-tailadmin-layout .links-filter-section {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    margin-top: 0 !important;
    box-sizing: border-box !important;
}

/* Giảm khoảng cách breadcrumbs và title */
body.with-tailadmin-layout .tailadmin-breadcrumbs {
    margin-top: 0 !important;
    margin-bottom: 12px !important;
}

body.with-tailadmin-layout .tailadmin-page-title {
    margin-top: 0 !important;
}

body.with-tailadmin-layout .tailadmin-page-description {
    margin-top: 0 !important;
    margin-bottom: 24px !important;
}

/* Collapsed sidebar layout sync */
body.sidebar-collapsed .tailadmin-header {
    left: var(--sidebar-collapsed-width) !important;
    width: calc(100% - var(--sidebar-collapsed-width)) !important;
    max-width: calc(100% - var(--sidebar-collapsed-width)) !important;
}

body.sidebar-collapsed.with-tailadmin-layout .tailadmin-main-content {
    margin-left: var(--sidebar-collapsed-width) !important;
    width: calc(100% - var(--sidebar-collapsed-width)) !important;
    max-width: calc(100% - var(--sidebar-collapsed-width)) !important;
}

body.sidebar-collapsed .tailadmin-sidebar {
    width: var(--sidebar-collapsed-width) !important;
    max-width: var(--sidebar-collapsed-width) !important;
}

/* Mobile responsive */
@media (max-width: 1024px) {
    .tailadmin-header {
        left: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
    }
    
    body.with-tailadmin-layout .tailadmin-main-content {
        margin-left: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
    }
}