@import url("Themes/BootstrapOverride.css");

:root
{
    --margin: 15px;
    --padding: 15px;
    
    --border-radius: 4px;
    
    --font-weight: 400;
    --font-weight-light: 300;
    --font-weight-heading: 400;
    --font-weight-strong: 600;
    
    --smallScreenMaxWidth: 940px;
    
    --pageBackgroundZ: -1;
    --pageContentZ: 0;
    --navbarZ: calc(var(--pageContentZ) + 50);
    --screensaverZ: calc(var(--navbarZ) + 1);
}

body
{
    font-family: system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-weight: var(--font-weight);
}

h1, h2, h3, h4, h5, h6
{
    margin-top: 0px;
    font-weight: var(--font-weight-heading);
}

strong
{
    font-weight: var(--font-weight-strong);
}

form
{
    margin-block-end: var(--margin);
}

.page-content
{
    z-index: var(--pageContentZ);
}

.content-container
{
    margin: var(--margin);
}

.navbar-fixed-bottom .navbar-collapse,
.navbar-fixed-top .navbar-collapse
{
    max-height: unset;
}

.border-bottom-text
{
    border-bottom: 1px solid #bdbdbd;
}

.no-margin-bottom
{
    margin-bottom: 0px;
}

.margin-bottom
{
    margin-bottom: var(--margin);
}

.text-align-right
{
    text-align: right;
}

.no-wrap,
.text-no-wrap
{
    white-space: nowrap;
}

.button-list
{
    display: flex;
    flex-wrap: wrap;
    gap: var(--padding);
}

.button-list > a,
.button-list > div,
.button-list > button
{
    flex: 1 1 0;
}

.panel-footer.button-list
{
    padding: calc(var(--padding) / 2);
    gap: calc(var(--padding) / 2);
}

label
{
    font-weight: 500;
}

/* // TODO: this shouldn't apply to panels inside a flex side by side instead of on top of each other */
.panel
{
    margin-bottom: var(--margin);
}

/*
.nav > li > a:focus,
.nav > li > a:hover
{
    border-radius: 4px;
}
*/