/* Eigenes CSS, wird auf jeder Seite (inkl. Login) automatisch nachgeladen. */
:root{
    --sturmfrei-light:#87b1ad;
    --sturmfrei-light-acent:hsl(174, 21%, 50%);
    --sturmfrei-dark:#18184c;
    --sturmfrei-dark-acent:hsl(227, 52%, 40%);
}
html{
    --sturmfrei-primary:var(--sturmfrei-light);
    --sturmfrei-primary-acent:var(--sturmfrei-light-acent);
    --sturmfrei-secondary:var(--sturmfrei-dark);
    --sturmfrei-secondary-acent:var(--sturmfrei-dark-acent);
}

html.dark-mode{
    --sturmfrei-primary:var(--sturmfrei-dark);
    --sturmfrei-primary-acent:var(--sturmfrei-dark-acent);
    --sturmfrei-secondary:var(--sturmfrei-light);
    --sturmfrei-secondary-acent:var(--sturmfrei-light-acent);
}

body{
    color:var(--sturmfrei-secondary);
    background-color:var(--sturmfrei-primary);
}
a,
html.dark-mode a{
    color:var(--sturmfrei-secondary);
    &:hover{
        color:var(--sturmfrei-secondary-acent);
    }
}

#logo {
    max-height: 60px;
    background-color: var(--sturmfrei-light);
}


#login-form {
    /* Beispiel: Akzentfarbe des Login-Buttons anpassen */
}

#login-footer{
    color:var(--sturmfrei-secondary);
}

.btn-primary,
html.dark-mode .btn-primary {
    background-color: var(--sturmfrei-secondary);
    border-color: var(--sturmfrei-primary);
    color:var(--sturmfrei-primary);

    &:hover:not(:disabled){
        background-color: var(--sturmfrei-secondary-acent);
        border-color: var(--sturmfrei-primary-acent);
        color:var(--sturmfrei-primary);
    }
}

#layout-content{
    background-color:var(--sturmfrei-primary);
}