@import url('variables.css');
@import url('login.css');
@import url('sidebar.css');
@import url('topbar.css');
@import url('home.css');
@import url('table.css');
@import url('topbar__reports.css');
@import url('section.css');
@import url('report_content.css');
@import url('modal.css');
@import url('account_information.css');
@import url('modal_confirmation.css');
@import url('alert_information.css');

*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: var(--font-family-base);
}

.layout {
    display: grid;
    grid-template-columns: auto 1fr;
    height: 100vh;
}

.layout__sidebar {
    background-color: var(--color-nav-bg-primary);
}

.layout__main {
    display: flex;
    flex-direction: column;
    height: 100vh;
    min-width: calc(100vw - 260px);
    max-width: 100%;
}

.layout__topbar {
    background-color: var(--color-light);
}

.layout__content {
    flex-grow: 1;
    overflow-y: auto;
    height: calc(100vh - 70px);
    width: 100%;
}

.layout__footer {
    display: flex;
}