@font-face {
    font-family: "Thieme Argo";
    src: url('../fonts/Thieme_Argo_2011-Bold.woff2') format('woff2');
}

@font-face {
    font-family: "Thiemicon";
    src: url('../fonts/Thiemicon.woff') format('woff');
}

:root {
    --thieme-light-blue: #a3d8f6;
    --thieme-dark-blue: #013476;
    --thieme-dark-blue-rgb: 1, 52, 118;
    --thieme-dark-blue-hover: #6aacda;
    --thieme-dark-blue-hover-rgb: 106, 172, 218;
    --thieme-dark-gray: #181818;
    --thieme-light-gray: #efefef;
    --thieme-on-light-blue: var(--thieme-dark-blue);
    --thieme-on-dark-blue: white;
    --thieme-on-dark-blue-rgb: 255, 255, 255;
}

:root, [data-bs-theme=light] {
    --bs-body-color: var(--thieme-dark-gray);
    --bs-heading-color: var(--thieme-dark-blue);
    --bs-link-color-rgb: var(--thieme-dark-blue-rgb);
    --bs-link-hover-color-rgb: var(--thieme-dark-blue-hover-rgb);
    --bs-info-rgb: var(--thieme-dark-blue-hover-rgb);
    --bs-info-text-emphasis: var(--thieme-dark-blue);
    --bs-info-bg-subtle: var(--thieme-light-blue);
    --bs-info-border-subtle: var(--thieme-light-gray)
}

body {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

footer {
    margin-top: auto;
    --bs-nav-link-font-size: 0.8rem;
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: "Thieme Argo", var(--bs-font-sans-serif);
}

.icon {
    font-family: 'Thiemicon';
    vertical-align: text-bottom;
    font-size: 0.75rem;
    line-height: 1rem;

    &.icon-arrow-right::after {
        content: "\004a";
    }

    &.icon-arrow-left::after {
        content: "\004b";
    }
}

.btn {
    font-family: "Thieme Argo", var(--bs-font-sans-serif);
    --bs-btn-font-size: 0.88rem;
    --bs-btn-border-width: 0;
    --bs-btn-border-radius: 0;
    --bs-focus-ring-width: 0;

    &[disabled], .disabled {
        --bs-btn-disabled-color: var(--bs-btn-color);
        --bs-btn-disabled-bg: var(--bs-btn-bg);
    }
}

.btn-default {
    --bs-btn-bg: var(--thieme-light-blue);
    --bs-btn-color: var(--thieme-on-light-blue);
    --bs-btn-hover-bg: var(--thieme-dark-blue-hover);
    --bs-btn-hover-color: var(--thieme-on-dark-blue);;
}

.btn-primary {
    --bs-btn-bg: var(--thieme-dark-blue);
    --bs-btn-color: var(--thieme-on-dark-blue);
    --bs-btn-hover-bg: var(--thieme-dark-blue-hover);
    --bs-btn-hover-color: var(--thieme-on-dark-blue);;
}

.btn-secondary {
    --bs-btn-bg: white;
    --bs-btn-color: var(--thieme-dark-blue);
    --bs-btn-border-color: var(--thieme-dark-blue);
    --bs-btn-border-width: 1px;
    --bs-btn-hover-bg: white;
    --bs-btn-hover-color: var(--thieme-dark-blue-hover);
    --bs-btn-hover-border-color: var(--thieme-dark-blue-hover);
}

.page-link {
    --bs-pagination-color: var(--thieme-dark-blue);
    --bs-pagination-hover-color: var(--thieme-dark-blue-hover);
}

.form-check-input:checked {
    background-color: var(--thieme-dark-blue);
    border-color: var(--thieme-light-gray);
}

.navbar {
    &.user {
        background-color: var(--thieme-dark-blue);
        color: var(--thieme-on-dark-blue);
        --bs-navbar-color: var(--thieme-on-dark-blue);
        --bs-navbar-hover-color: var(--thieme-on-dark-blue);
        --bs-navbar-active-color: var(--thieme-light-gray);
    }

    &.brand {
        background-color: var(--thieme-light-blue);
        color: var(--thieme-on-light-blue);
        --bs-navbar-color: var(--thieme-on-light-blue);
    }

    &.menu {
        --bs-navbar-color: var(--thieme-dark-blue);
        border-bottom: 1px solid var(--thieme-light-gray);
    }
}