:root{
    --colorbgbodylight: {{ app.session.get('colorbgbodylight')|raw }};
    --colorbgbodydark: {{ app.session.get('colorbgbodydark')|raw }};
    --colorfttitlelight: {{ app.session.get('colorfttitlelight')|raw }};
    --colorfttitledark: {{ app.session.get('colorfttitledark')|raw }};   
    --colorftbodylight: {{ app.session.get('colorftbodylight')|raw }};
    --colorftbodydark: {{ app.session.get('colorftbodydark')|raw }};       
    --fontbody: "{{ app.session.get('fontbody')|raw }}";
    --fonttitle: "{{ app.session.get('fonttitle')|raw }}";
}

/* COLOR BODY  */

body {
    background-color: var(--colorbgbodylight);
    color:  var(--colorftbodylight);
}

.card {
    background-color: var(--colorbgbodylight);
}

body .navbar.bg-dark {
    background-color: var(--colorbgbodydark)!important;
}

body #sidebar {
    background-color: var(--colorbgbodydark);
}

body #sidebar .title {
    color: var(--colorfttitledark); 
}

body #sidebar .nav a {
    color: var(--colorfttitledark); 
}

body h1, body h2, body h3 {
    color: var(--colorfttitlelight); 
}

body a, body .btn-link {
    color: var(--colorfttitlelight); 
}

body .nav a{
    color: var(--colorfttitledark); 
}


/* COLOR BODY HOME */


body.monocolor {
    background-color: var(--colorbgbodydark);
    color:  var(--colorftbodydark);
}

body.monocolor .card {
    background-color: var(--colorbgbodydark);
}

body.monocolor .navbar.bg-dark {
    background-color: var(--colorbgbodydark)!important;
}

body.monocolor #sidebar {
    background-color: var(--colorbgbodydark);
}

body.monocolor #sidebar .title {
    color: var(--colorfttitledark); 
}

body.monocolor #sidebar .nav a {
    color: var(--colorfttitledark); 
}

body.monocolor h1, body.monocolor h2, body.monocolor h3 {
    color: var(--colorfttitledark); 
}

body.monocolor a, body.monocolor .btn-link {
    color: var(--colorfttitledark); 
}

body.monocolor .nav a{
    color: var(--colorfttitledark); 
}



/* FONT */
body {
    font-family: var(--fontbody); 
}

h1,h2,h3, .navbar-brand {
    font-family:  var(--fonttitle); 
}


{% if not useheader is defined or not useheader %}
#main {
    padding:0px;
}
{%endif%}