:root {
    --app-background-color: #D0D0D0;
    /* PrimeVUE */
    --p-menubar-background: #4A773C;
    --p-menubar-mobile-button-color: white;
    --p-menubar-item-color: white;
    --p-menubar-border-radius: 0;

    --p-menubar-submenu-background: #4A773C;

    --p-tabs-tab-background: white;
    --p-tabs-tab-active-background: white;
    --p-tabs-tablist-background: var(--app-background-color);
    --p-tabs-tabpanel-background: var(--app-background-color);


    --p-tag-warn-background: #FFC680;
    --p-tag-warn-color: black;
}


/* Layout geral */
body {
    margin: 0;
    padding: 0;
}

#app {
    height: 100%;
    width: 100%;

    font-family: Arial, Helvetica, sans-serif;
}

#bottom {
    position: absolute;
    bottom: 0px;
    height: 1.5em;
    width: 100%;
    padding-top: 4px;

    color: white;
    background-color: #4A773C;
}

#header {
    position: absolute;
    top: 0px;
    height: 4.3em;
    width: 100%;
}

#middle {
    position: absolute;
    overflow: auto;

    top: 5.85em; /* 4.3em */
    bottom: 1.52em;
    width: 100%;
    padding: 0;
    margin: 0;
    border: 0;

    color: #0F0F0F;
    background-color: var(--app-background-color);
}


/* Páginas do dashboard */
.dashboard-page {
    height: 100%;
    width: 100%;

    background-color: var(--app-background-color);
}

.d-panel {
    background-color: white;
    border: 1px solid #CFCFCF;
    border-radius: 5px;
}

.d-panel-background {
    background-color: white;
}

.d-panel-border {
    border: 1px solid #CFCFCF;
    border-radius: 5px;
}

.d-panel-content {
    margin: 3px 3px 3px 3px;
}

.fake-data {
    border: 2px solid red;
}

.fake-data-footer {
    border: 2px solid red;
    color: white;
    background-color: red;
}

.p-menu-item-selected {
    font-weight: bold;
}

.chart-title {
    color: #585858;
    font-size: 0.75em;
    font-weight: bold;
}

.chart-sub-title {
    color: #585858;
    font-size: 0.75em;
}

.tag-data-dados {
    background-color: #EEEEEE;
    color: black;
}