/* ----------------------------------------------------------
   GLOBAL
---------------------------------------------------------- */
@import url('css/modern-theme.css');

html, body {
    height: 100%;
    overflow: hidden !important;
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
    background: var(--bg-primary);
    color: var(--text-primary);
}

/* Evita overflow horizontal global */
* {
    min-width: 0;
    box-sizing: border-box;
}

/* ----------------------------------------------------------
   MAIN LAYOUT ROOT
---------------------------------------------------------- */
.layout-root {
    height: 100vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

    .layout-root > *:first-child {
        flex-shrink: 0; /* Navbar fijado */
    }

/* Contenido bajo el navbar */
.main-content {
    flex: 1 1 auto;
    overflow: hidden !important;
    min-height: 0 !important;
    display: flex;
    flex-direction: column;
}

/* ----------------------------------------------------------
   HOME PAGE (donde está el SfGrid)
---------------------------------------------------------- */
.page-root {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-height: 0;
}

.grid-wrap {
    flex: 1 1 auto;
    display: flex;
    overflow: hidden;
    min-height: 0;
}

    /* ----------------------------------------------------------
   SYNCFUSION GRID FULLSCREEN FIX
---------------------------------------------------------- */

    /* Hacer que el grid funcione como layout flex vertical */
    .grid-wrap .e-grid {
        display: flex !important;
        flex-direction: column !important;
        width: 100%;
        height: 100% !important;
        min-height: 0 !important;
    }

    /* Toolbar, header y pager no deben contraer el contenido */
    .grid-wrap .e-toolbar,
    .grid-wrap .e-gridheader,
    .grid-wrap .e-gridpager {
        flex-shrink: 0 !important;
    }

    /* Área de datos del grid = zona con scroll */
    .grid-wrap .e-gridcontent {
        flex: 1 1 auto !important;
        overflow: auto !important;
        min-height: 0 !important;
    }

/* ----------------------------------------------------------
   NAVBAR (MainNavBar)
---------------------------------------------------------- */
.main-navbar,
.sf-toolbar,
.sf-toolbar .e-toolbar {
    height: 60px !important;
    min-height: 60px;
    max-height: 60px;
    flex-shrink: 0 !important;
}

    /* Limitar tamaño de logos */
    .main-navbar svg,
    .image-container svg {
        height: 40px;
        max-height: 40px;
    }

/* ----------------------------------------------------------
   BLazor Error Boundary
---------------------------------------------------------- */
.blazor-error-boundary {
    background: #b32121;
    color: white;
    padding-left: 3.7rem;
}

    .blazor-error-boundary::after {
        content: "Ha ocurrido un error.";
    }

/* ----------------------------------------------------------
   GENERAL SYNCFUSION FIXES
---------------------------------------------------------- */
.e-control {
    max-width: 100%;
}

/* ----------------------------------------------------------
   MOBILE SUPPORT
---------------------------------------------------------- */
@media (max-width: 768px) {
    .grid-wrap .e-grid {
        height: calc(100dvh - 60px) !important;
    }
}