/** @license For full copyright and license information, please see the LICENSE.md file. */

/**
 * @file engine-layout.css
 * @description Layout Boundary, 100vw Containment, Page Body, Sizing Tokens, and Submodule Imports.
 * @module EngineStyles/Layout
 */

@import url('./engine-layout-sidebar.css');
@import url('./engine-layout-mobile.css');
@import url('./engine-layout-search.css');
@import url('./engine-layout-components.css?v=20260929c');
@import url('./engine-layout-switcher.css');

/* Layout Boundary & Strict 100vw Viewport Containment */
html,
body {
    overflow-x: hidden !important;
    max-width: 100vw !important;
    width: 100vw !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}

.page {
    min-height: 100vh !important;
    min-height: 100dvh !important;
    max-width: 100vw !important;
    width: 100vw !important;
    overflow-x: hidden !important;
    display: flex !important;
    flex-direction: column !important;
    box-sizing: border-box !important;
}

@media (min-width: 992px) {
    .page {
        flex-direction: row !important;
    }
}


.page-body {
    flex: 1 1 auto !important;
    display: flex !important;
    flex-direction: column !important;
    min-width: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
    box-sizing: border-box !important;
    overflow-x: hidden !important;
}

.page-body > .container-fluid {
    flex: 1 1 auto !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 1rem !important;
    min-width: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
    overflow-x: hidden !important;
    box-sizing: border-box !important;
}

/* Engine Module Root Section Containment */
.engine-module-section {
    min-width: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
    overflow-x: hidden !important;
    box-sizing: border-box !important;
}

.engine-module-section > * {
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

/* Percentage Width Tokens for DataGrids and Tables */
.w-pct-10 { width: 10% !important; }
.w-pct-15 { width: 15% !important; }
.w-pct-20 { width: 20% !important; }
.w-pct-25 { width: 25% !important; }
.w-pct-30 { width: 30% !important; }
.w-pct-32 { width: 32% !important; }
.w-pct-35 { width: 35% !important; }
.w-pct-38 { width: 38% !important; }
.w-pct-40 { width: 40% !important; }
.w-pct-45 { width: 45% !important; }
.w-pct-50 { width: 50% !important; }

/* Custom Max Dimensions and Fixed Column Width Tokens */
.engine-max-w-150 { max-width: 150px !important; }
.engine-max-w-160 { max-width: 160px !important; }
.engine-max-w-180 { max-width: 180px !important; }
.engine-max-w-250 { max-width: 250px !important; }
.engine-max-w-280 { max-width: 280px !important; }
.engine-max-w-320 { max-width: 320px !important; }
.engine-max-w-360 { max-width: 360px !important; }
.engine-max-w-380 { max-width: 380px !important; }
.engine-max-w-400 { max-width: 400px !important; }
.engine-max-w-420 { max-width: 420px !important; }

.engine-max-h-400 { max-height: 400px !important; }
.engine-max-h-420 { max-height: 420px !important; }
.engine-max-h-480 { max-height: 480px !important; }
.engine-min-h-220 { min-height: 220px !important; }
.engine-min-h-250 { min-height: 250px !important; }
.engine-min-h-280 { min-height: 280px !important; }
.engine-min-h-360 { min-height: 360px !important; }

.engine-col-w-36 { width: 36px !important; min-width: 36px !important; }
.engine-col-w-40 { width: 40px !important; }
.engine-col-w-48 { width: 48px !important; min-width: 48px !important; }
.engine-col-w-60 { width: 60px !important; }
.engine-col-w-80 { width: 80px !important; }
.engine-col-w-85 { width: 85px !important; }
.engine-col-w-100 { width: 100px !important; }
.engine-col-w-120 { width: 120px !important; }
.engine-col-w-140 { width: 140px !important; }
.engine-col-w-160 { width: 160px !important; }

.engine-h-36 { height: 36px !important; }
.engine-min-w-140 { min-width: 140px !important; }
.engine-w-210 { width: 210px !important; }
.engine-z-1070 { z-index: 1070 !important; }