@import 'AdminSys.Testen.Client.ee83859pno.bundle.scp.css';
@import '_content/AdminSys.Web.Gedeeld/AdminSys.Web.Gedeeld.ur945dlno5.bundle.scp.css';

/* /Components/Layout/TestLayout.razor.rz.scp.css */
.testlayout[b-1p17ozc5mv] {
    min-height: 100dvh;
    display: flex;
    flex-direction: column;
}

.testkop[b-1p17ozc5mv] {
    display: flex;
    align-items: center;
    gap: 16px;
    height: 56px;
    padding: 0 max(20px, env(safe-area-inset-left));
    background: var(--zijbalk);
    color: var(--zijbalk-tekst);
}

.testkop-titel[b-1p17ozc5mv] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-right: auto;
    color: inherit;
    text-decoration: none;
}

/* Het merk (Merk uit de gedeelde bibliotheek, daarom ::deep) iets kleiner dan in de zijbalk van de webapp */
.testkop-titel[b-1p17ozc5mv]  .merk-tegel {
    width: 32px;
    height: 32px;
}

.testkop-titel[b-1p17ozc5mv]  .merk-naam {
    font-size: 1.25rem;
}

.testkop-naam[b-1p17ozc5mv] {
    color: var(--zijbalk-tekst-zacht);
}

.testkop .e-btn[b-1p17ozc5mv] {
    color: var(--zijbalk-tekst);
}

/* Licht/donker in de donkere kop: klein en doorschijnend (Themakeuze uit de gedeelde bibliotheek, daarom ::deep) */
.testkop[b-1p17ozc5mv]  .thema-optie {
    padding: 4px 10px;
    border-color: color-mix(in srgb, var(--zijbalk-tekst) 30%, transparent);
    background: transparent;
    color: var(--zijbalk-tekst-zacht);
    font-size: .8rem;
}

    .testkop[b-1p17ozc5mv]  .thema-optie.actief {
        border-color: var(--zijbalk-tekst);
        color: var(--zijbalk-tekst);
    }

/* Op een telefoon alleen de titel en Uitloggen */
@media (max-width: 600px) {
    .testkop[b-1p17ozc5mv]  .thema-keuze {
        display: none;
    }
}

.testinhoud[b-1p17ozc5mv] {
    flex: 1;
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    padding: 24px 20px calc(24px + env(safe-area-inset-bottom));
    box-sizing: border-box;
}