/* ===========================================================================
   schermtabs.css - de tabmodus van Onderhoudsraamwerk.

   Los bestand, net als vakblok.css: het hoort bij een indeling die maar een
   paar schermen gebruiken, en zo is te zien wat erbij hoort. Wordt ingeladen
   in Components/App.razor.

   In de gewone indeling staat het raster op een ingestelde hoogte met een
   sleepbare scheiding eronder (--raster-hoogte in app.css). In de tabmodus
   staat het raster alleen op zijn eigen tabblad en hoort het die ruimte
   helemaal te vullen. Vandaar dat de vaste hoogte hier weer uit gezet wordt.
   =========================================================================== */

/* De tabstrook zelf vult wat er onder de balk overblijft. Zonder min-height:0
   groeit een flexonderdeel mee met zijn inhoud en verdwijnt de knoppenbalk
   onderaan buiten beeld. */
.scherm-tabs > .rz-tabview {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
    min-width: 0;
}

.scherm-tabs > .rz-tabview > .rz-tabview-nav-container {
    flex: 0 0 auto;
}

.scherm-tabs .rz-tabview-panels {
    flex: 1 1 auto;
    min-height: 0;
    /* De detailtabbladen mogen schuiven; het rastertabblad regelt dat zelf
       (zie hieronder), dus daar komt geen tweede schuifbalk bij. */
    overflow: auto;
    padding: 8px 10px;
}

.scherm-tabs .rz-tabview-panel {
    height: 100%;
    min-height: 0;
}

/* ------------------------------------------------------- het rastertabblad */

.scherm-tabs .raster-omhulsel {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    height: 100%;
    min-height: 0;
}

.scherm-tabs .raster-blok {
    /* Overschrijft de vaste hoogte uit app.css: op een eigen tabblad heeft het
       raster geen buurman meer om ruimte mee te delen. */
    flex: 1 1 auto;
    height: auto;
    min-height: 0;
}

/* Het tabblad met het raster heeft geen binnenmarge nodig; het raster loopt
   liever tot de rand door, zoals in de gewone indeling. */
.scherm-tabs .rz-tabview-panel:first-child {
    padding: 0;
}