@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.5.0/font/bootstrap-icons.css");
@font-face {
    font-family: Poppins;
    src: url(fonts/Poppins-Medium.ttf);
}

html {
    min-height: 100%;
    height: 100%
}

body {
    font-family: Poppins, Helvetica, Arial, sans-serif;
    background-color: #fff;
    overflow-x: hidden;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.vToaster-container {
    display: flex;
    justify-content: flex-end;
    width: 100%;
    white-space: pre-line;
}

.custom-vToaster {
    right: 5rem;
    top: 5rem;
}

app {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 100%;
    flex: 1 0 auto;
}

hr {
    margin: 2rem 0;
}

.table-head-fixed {
    background-color:white;
    height: 160px;
    position: sticky;
    top: 0;
    z-index: 1;
}

.table-container {
    overflow-x: auto;
}

.nav-link-light{
    background-color: azure;
}

.container-fluid {
    min-height: 100%;
    flex: 1 0 auto;
}

.container-fluid .row 
{
    --bs-gutter-x: 0;
}

.pikbon {
    margin-top: 1rem;
}

.pikbon h4 {
    padding: 0.5rem 0rem;
}

.bd-menu {
    padding: 1.5rem;
    margin-right: 0;
    margin-left: 0;
    border-width: 1px;
    border-top-left-radius: .25rem;
    border-top-right-radius: .25rem;
}

a {
    text-decoration: none;
}

header {
    padding: 1rem;
}

header a {
    padding: 0.25rem;
}

header a span {
    padding-left: 1rem;
}

header #search input {
    width: 100%;
    padding: 1rem;
    border: none;
    border-radius: 0;
    border-bottom: #1e1e1e solid 1px;
}

header #user_menu {
    margin-top: 1rem;
    text-align: center;
}

header #user_menu a {
    color: #1e1e1e;
    margin: 0 0.25rem;
}

header #user_menu a:hover {
    color: #e00020;
}

header #user_menu a i {
    font-size: 1.75em;
}

header #user_menu #account_menu {
    border: 1px solid #1e1e1e;
    text-align: center;
}

header #user_menu #account_menu ul {
    list-style: none;
    padding-left: 0;
    padding-bottom: 0;
    margin-bottom: 0.25rem;
}

header #user_menu #account_menu ul {
    padding: 0.1rem;
}

main .col-sm {
    padding: 0;
}

main #edit_table
{
    width: 97%;
}

main #edit_table tbody .adres_edit td label {
    display: block;
}

main #edit_table tbody .adres_edit td label input {
    width: 97%
}

main table {
    padding: 1rem;
    margin-top: 1rem;
    margin-bottom: 1rem;
}

.vGrid-table {
    padding: 0;
    margin-top: 0;
    margin-bottom: 0;
}

main table tr {

}

main table tr td {
    padding: 0.25rem;
}

footer {
    background-color: #1e1e1e;
    color: #fff;
    font-size: 0.875rem;
    text-align: right;
    width: 100%;
    padding-right: 0.5rem;
}

footer a {
    color: #e00020;
}

footer a:hover {
    color: #fff;
}

.breadcrumbs {
    background-color: #1e1e1e;
    color: #fff;
}

.row .menu {
    padding: 0;
}

.menu ul li:first-letter {
    text-transform: uppercase;
}

.menu ul {
    border-radius: 0;
}

.menu ul li {
    background-color: #e00020;
    color: #fff;
    border: none;
    border-radius: 0;
    border-bottom: 1px solid #ccc;
}

.menu ul li:hover {
    background-color: #ca0522;
}

.menu ul li a {
    color: #fff;
    text-decoration: none;
    padding-left: 0.5rem;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    display: block;
    overflow-wrap: break-word;
}

.menu .list-group-item {
    padding: 0 0;
}

.menu .list-subgroup {
    background-color: #b40620;
    border: none;
    border-radius: 0;
}

.menu .list-subgroup .list-subgroup-item {
    background-color: #b40620;
    border: none;
    border-radius: 0;
    padding-left: 0.5rem;
}

.menu .list-subgroup .list-subgroup-item:hover {
    background-color: #db0d2c;
}

.menu .list-subgroup .list-subgroup-item a {
    color: #fff;
}

.alert {
    border-radius: 0 !important;
    border: none;
    margin-bottom: 0;
    color: #1e1e1e !important;
}

.alert a {
    color: #1e1e1e;
    float: right;
}

.items .item {
    padding: 0.5rem;
    margin: 0.5rem;
    background-color: #efeee9;
    width: 97%;
    color: #212529;
}

.items .item img {
    display: inline-block;
    width: 150px;
    height: 180px;
}

.items .item span {
    display: block;
    font-size: 0.9em;
    padding-bottom: 0.25rem;
}

.items .item small {
    display: block;
    font-size: 0.75em;
}

.items .item small:first-letter {
    text-transform: uppercase;
}

.items .item small i {
    margin-right: 0.25rem;
}

.items .item a {
    background-color: #e00020;
    color: #fff;
    padding: 0.25rem 0.5rem;
    width: 100%;
    font-size: 1.25em;
}

.items .item a i {
    font-size: 1.5em;
    display: inline-block;
    width: 29%;
}

.items .item a b {
    font-size: 1.15em;
    display: inline-block;
    width: 70%;
    text-align: right;
}

.items .item a:hover {
    background-color: #1e1e1e;
    transition: background-color 100ms linear;
}

.items .item a:active {
    background-color: #e00020;
}

.items .item .tags {

}

.items .item .tags small {
    display: inline-flex;
    border-color: #1e1e1e;
    border: 1px solid;
    padding: 0.1rem 0.2rem;
    margin: 0.10rem 0rem;
    font-size: 0.65em;
    background-color: #1e1e1e;
    color: #fff;
}

#order_counts {
    width: 99%;
    margin-top: 1rem;
}

#order_counts .bar {
    font-size: 0.75rem;
    --labels-size: 18rem;
}

#order_counts .bar tbody th {
    text-align: left;
    width: inherit !important;
}

#order_counts .bar tbody tr {
    margin-top: 0.2rem;
    margin-bottom: 0.2rem;
}

#order_counts .bar tbody tr td {
    padding: 0.25rem;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    color: white;
}

#my_orders {

}

#my_orders ul {
    list-style: none;
}

#my_orders ul .order {
    padding: 0.25rem;
}

#my_orders ul .order a {
    color: #1e1e1e;
}

#my_orders ul .order span {
    width: 97%;
}

#my_orders ul .order span:first-of-type {
    color: #e00020;
}

#my_orders ul .order span:first-of-type:hover {
    color: #1e1e1e;
}

#my_orders ul .order span small {
    font-size: 0.75rem;
    color: #1e1e1e;
}

#my_orders ul .order ul {
    margin-top: 0.25rem;
    padding: 0.25rem 0.5rem;
    border-top: 1px dashed #1e1e1e;
}

#my_orders ul .order ul li {
    padding: 0.25rem 0.5rem;
}

#my_orders ul .order ul li span {
    color: #1e1e1e !important;
}

#my_orders ul .order:nth-child(2n+1) {
    background-color: #efeee9;
}

#my_cart {
}

#my_cart ul {
    list-style: none;
}

#my_cart ul .product {
    padding: 0.25rem;
}

#my_cart ul .product a {
    color: #e00020;
}

#my_cart ul .product a:hover {
    color: #1e1e1e;
}

#my_cart ul .product span:first-of-type {
    display: block;
    width: 99%;
    text-align: center;
}

#my_cart ul .product span {
    text-align: center;
    width: 49%;
}

#my_cart ul .product span:last-of-type {
    display: block;
    width: 99%;
    text-align: center;
}

#my_cart ul .product span a i {
    float: right;
}

#my_cart ul .product span small {
    font-size: 0.75rem;
    color: #1e1e1e;
}

#my_cart ul .product i {
    font-size: 2em;
    padding-right: 0.25rem;
    float: left;
}

#my_cart ul .product ul {
    margin-top: 0.25rem;
    padding: 0.25rem 0.5rem;
    border-top: 1px dashed #1e1e1e;
}

#my_cart ul .product:nth-child(2n+1) {
    background-color: #efeee9;
}

#checkout_cart span {
    float: right;
}

#checkout_cart a {
    float: right;
}

#checkout {
    text-align: center;
}

#checkout label {
    width: 75%;
}

#checkout button {
    width: 75%;
    margin: 0 auto;
}

#checkout label input {
    display: block;
    width: 100%;
    padding: 0.25rem;
}

#checkout label select {
    display: block;
    width: 100%;
    padding: 0.25rem;
}

#checkout .thuislevering_adres {

}

#checkout .thuislevering_adres label input {

}

.checkout_summary ul {
    list-style: none;
}

.checkout_summary ul .product {
    padding: 0.25rem;
}

.checkout_summary ul .product a {
    color: #e00020;
}

.checkout_summary ul .product a:hover {
    color: #1e1e1e;
}

.checkout_summary ul .product span:first-of-type {
    display: block;
    width: 99%;
    text-align: center;
}

.checkout_summary ul .product span {
    text-align: center;
    width: 49%;
}

.checkout_summary ul .product span a i {
    float: right;
}

.checkout_summary ul .product span small {
    font-size: 0.75rem;
    color: #1e1e1e;
}

.checkout_summary ul .product i {
    font-size: 2em;
    padding-right: 0.25rem;
    float: left;
}

.checkout_summary ul .product ul {
    margin-top: 0.25rem;
    padding: 0.25rem 0.5rem;
    border-top: 1px dashed #1e1e1e;
}

.checkout_summary ul .product:nth-child(2n+1) {
    background-color: #efeee9;
}

.checkout_summary {
    text-align: center;
}

checkout_summary input[type=checkbox] {
    transform: scale(1.5);
    margin-top: 0.25rem;
    margin-bottom: 0.5rem;
}

.checkout_summary label a {
    color: #e00020;
}

.checkout_summary label a:hover {
    color: #b40620;
}

.afhaalpunt_info * {
    display: block;
}

.adres_info * {
    display: block;
}

#confirmation {
    text-align: center;
}

/*.btn-primary {
    background-color: #1e1e1e;
    border-color: #111;
}

.btn-primary:hover {
    background-color: #fff;
    color: #1e1e1e;
    border-color: #111;
}

.btn-primary:active {
    background-color: #fff;
    color: #1e1e1e;
    border-color: #111;
}

.btn-primary:focus {
    background-color: #fff;
    color: #1e1e1e;
    border-color: #111;
}*/

#blazor-error-ui {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

#blazor-error-ui .dismiss {
    cursor: pointer;
    position: absolute;
    right: 0.75rem;
    top: 0.5rem;
}

.hidden {
    display: none;
}

@media screen and (min-width: 1020px) {

    .items .item {
        padding: 0.5rem;
        margin: 0.5rem;
        background-color: #efeee9;
        width: 400px;
    }
}

@media screen and (min-width: 768px) {

    #my_orders ul .order span {
        width: 16.6666667%;
    }

    #my_orders ul .order ul li span:first-of-type {
        width: 50%;
    }

    /*#my_orders ul .order ul li span:last-of-type {
        width: 25%;
    }*/

    #my_cart ul .product span:first-of-type {
        width: 49%;
        text-align: left;
    }

    #my_cart ul .product span:last-of-type {
        display: inline;
        width: 17%;
    }

    #my_cart ul .product span {
        width: 17%;
    }

    #checkout label {
        width: 50%;
    }

    #checkout button {
        width: 50%;
    }

    .checkout_summary ul .product span:first-of-type {
        width: 49%;
        text-align: left;
    }

    .checkout_summary ul .product span {
        width: 17%;
    }

    div .blackitemtag small {
        display: inline-flex;
        border-color: #1e1e1e;
        border: 1px solid;
        padding: 0.1rem 0.2rem;
        margin: 0.10rem 0rem;
        font-size: 0.65em;
        background-color: #1e1e1e;
        color: white !important;
        height: 19px;
    }
}

/* Order status colors */

.order-label-danger {
    background-color: #E00020;
    padding: 2.5px 5px;
    color: white;
    font-weight: bold;
    text-transform: uppercase;
    border-radius: .2rem;
}

.order-label-success {
    background-color: #0c884e;
    padding: 2.5px 5px;
    color: white;
    font-weight: bold;
    text-transform: uppercase;
    border-radius: .2rem;
}

.order-label-warning {
    background-color: #967100;
    padding: 2.5px 5px;
    color: white;
    font-weight: bold;
    text-transform: uppercase;
    border-radius: .2rem;
}

.order-label-caution {
    background-color: #BA4703;
    padding: 2.5px 5px;
    color: white;
    font-weight: bold;
    text-transform: uppercase;
    border-radius: .2rem;
}

.order-table-background-danger {
    background-color: #FFB9C3;
}

.order-table-background-success {
    background-color: #BFF3DB;
}

.order-table-background-warning {
    background-color: #FFEDB8;
}

.order-table-background-caution {
    background-color: #FED3B0;
}

/* PrintOrders */

.printOrders-filter {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-end;
    flex-wrap: wrap;
}

.clearFilters {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin-right: 1rem;
    justify-content: flex-end;
}

.btn-stock-container {
    display: flex;
    justify-content: flex-start;
}

.btnStock {
    display: inline-flex;
    align-items: center;
    color: white;
    background-color: #1E1E1E;
    border: none;
    font-size: 1rem;
    padding: .3rem;
    margin-left: .5rem;
    border-radius: 4px;
    text-transform: uppercase;
}

.btnStock-primary {
    display: inline-flex;
    align-items: center;
    color: white;
    background-color: #E00020;
    border: none;
    font-size: 1rem;
    padding: .3rem;
    margin-left: .5rem;
    border-radius: 4px;
    text-transform: uppercase;
}

.labelStock {
    margin-left: .5rem;
    font-size: 1rem;
}

.labelTotalStock {
    margin-left: .5rem;
    font-weight: bold;
    font-size: 1rem
}

.labelTotalStock-display {
    margin-left: .5rem;
    font-size: 1rem;
    margin-bottom: .5rem;
}


.bijvoegen-container {
    display: flex;
    justify-content: flex-start;
    flex-direction: row;
    align-items: baseline;
    flex-wrap: nowrap;
    margin-bottom: .5rem;
}

.bijvoegen-container-stock {
    margin-left: 2rem;
    display: flex;
    justify-content: flex-start;
    flex-direction: row;
    align-items: baseline;
    flex-wrap: nowrap;
}

.input-width {
    margin-left: .5rem !important;
    width: 60px;
}

.totalStock-container {
    margin-left: .5rem;
    font-weight: bold;
}

.width-drukkers-select {
    width: -webkit-fit-content;
}

/* Externe afdruktaken */
.printOrders-filters {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
}

.printOrders-filter-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.printOrders-filters-left {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
}

.printOrders-filters-item-group {
    display: flex;
    flex-direction: row;
}

.printOrder-locked-container {
    display: flex;
    justify-content: flex-start;
}

.Afgeleverd-item-container {
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-content: flex-start;
    align-items: flex-start;
}

.Afgeleverd-label {
    font-weight: bold;
}

/* Beheer studiematerialen */

.beheerStudiemateriaal-filters {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
}

.beheerStudiemateriaal-filters-left {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    
}

.beheerStudiemateriaal-filters-right {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

.typeStudiemateriaal-filter, .typeOnderwijs-filter, .studiegebied-filter, .actiefWebshop-filter {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin-right: 1rem;
}

.cursusmanagement-studiemateriaal-actions-container {
    position: absolute;
    right: 0;
    margin-right: 1.7rem;
    margin-top: -.3rem;
}

.sync-webshop-textarea {
    width: 100%;
}

.beheerstudiemateriaal-default-value-no-cursus {
    font-style: italic;
}

/* Externe Afdruktaken*/
.afdruktaken-filters-container {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    flex-direction: row;
}

.afdruktaken-filters-row {
    display: flex;
    flex-direction: row;
    margin: 10px;
    width: 500px;
}

.filter-studiegebied {
    display: flex;
    flex-direction: column;
    margin: 10px;
    width: 200px;
}

.filter-typeOnderwijs {
    display: flex;
    flex-direction: column;
    margin: 10px;
    width: 200px;
}

.filter-orders {
    display: flex;
    flex-direction: row;
    margin: 10px;
    justify-content: flex-end
}


/* VSplitDropdown */
.align-bestanden-btns {
    display: flex;
    flex-direction: column;
    padding: 1rem;
}

.vSplitDropdown-item {
    margin-bottom: 1rem;
}

.vSplitDropdown-container {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: stretch;
    justify-content: flex-start;
}

vSplitDropDown-content {
    position: absolute;
    display: inline-block;
}

.vSplitDropdownBtn {
    width: max-content;
    font-size: .9rem;
    height: 48px;
    padding: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: nowrap;
    border: none;
    border-style: none; 
    
    border-radius: 5px;
    border-bottom-right-radius: 0rem;
    border-top-right-radius: 0rem;

    background-color: #e00020;
    color: white;
}

.vSplitDropdownBtn-toggle {
    height: 48px;
    padding: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: nowrap;
    border: none;
    border-style: none;
    
    border-radius: 5px;
    border-bottom-left-radius: 0rem;
    border-top-left-radius: 0rem;
    
    background-color: #e00020;
    color: white;
}

.vSplitDropdownBtn:hover, .vSplitDropdownBtn-toggle:hover {
    background-color: #AD0019;
}

.vSplitDropdown-content-items {
    display: none;
    position: absolute;
    background-color: white;
    min-width: 160px;
    z-index: 444;
    transform: translate(-365px, 3px);
}

.vSplitDropdown-content-items a {
    color: #1E1E1E;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
}

.vSplitDropdown-content-items a:hover {
    background-color: #efeee9;
}

.vSplitDropdown-content:hover .vSplitDropdown-content-items {
    display: block;
}

.btn-redirect {
    width: max-content;
    margin-left: 1rem;
    font-size: .9rem;
}

@media screen and (max-width: 768px) {
    #app_menu button {
        width: 100%;
    }
}

.beheerStudiemateriaal-filters > div > div > .vSelect-primary {
    width: 100%;
}

.icon-orderDetail {
    width: 40px;
    height: 40px;
    padding: .25rem;
}

/* Externe afdruktaken grid */

/* 
#ExterneAfdruktakenGridId-shortcutsButton, #ExterneAfdruktakenGridId-selectViewButton, #ExterneAfdruktakenGridId button.btnControl.dropdown-toggle {
    display: none !important;
}
*/

.btnHideAlert {
    background-color: none;
    border: 1px solid #1E1E1E;
    color: #1E1E1E;
    padding: .25rem;
    border-radius: .25rem;
    font-size: .85rem;
}

.form-SB-link, .form-SB-link:hover {
    color: white;
    text-decoration: none;
}

.caution-color {
    color: #BA4703;
}

.reeds-aangekocht-tag {
    background-color: #e18535 !important;
    font-weight: bold;
}

#edit_table .orderlines {
    border-top: black 2px dotted;
    margin-top: 1rem;
    margin-bottom: 0.25rem;
    padding: 1rem 0rem;
}

/* Orderlijst - vDatatable */

.vDataTable-table {
    margin: 0 !important;
    padding: 0 !important;
}

.orderlijst-table-container {
    padding-top: 2rem;
    padding-bottom: 1rem;
}

.orderlijst-filters-row,
.orderlijst-buttonBulkActions-row {
    display: flex;
    justify-content: flex-start;
    flex-direction: row;
    flex-wrap: wrap;
}

.orderlijst-controls-row {
    display: flex;
    justify-content: flex-start;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: flex-end;
    padding-bottom: 1rem;
}

.orderlijst-controls-item {
    display:flex;
    flex-direction: column;
    padding-right: 1rem;
}

.orderlijst-sort-buttons {

}

.orderlijst-title {
    text-transform: uppercase;
    font-weight: bold;
    font-size: 1.25rem;
}

.order-bulk-actions {
    display: flex;
    align-items: center;
    flex-direction: row;
    justify-content: space-between
}

.order-filter-item {
    padding-right: 1rem;
}

.order-filter-item-input-container {
    display: flex;
    flex-direction: row;
    align-items: center;
}

.bulk-select-container {
    display: flex;
    flex-direction: row;
}

.bulk-select-reset-btn,
.order-filter-item-reset-btn {
    margin-left: .5rem;
    background: none;
    border: none;
}

.vDataTable-actions {
    display: flex !important;
    flex-direction: row !important;
    width: 100% !important;
    flex-wrap: wrap !important;
    justify-content: flex-end !important;
}

/* Orderdetail */

.order-detail-container {
    background-color: white;
}

.order-detail-item {
    padding: 1rem !important;
}

.order-detail-student-info {
    padding: .5rem;
}

.order-actions-items-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-direction: row;
}

.order-action-items {
    display: flex;
    justify-content: flex-start;
}

.order-edit-action-item {
    display: flex;
    justify-content: flex-end;
}

.btn-action-spacing {
    margin-right: .5rem !important;
}

/* AdresEdit Component */

.adres-edit-input-container {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;

    padding: 1rem;
}

.adres-edit-input-group {
    display: flex;
    flex-direction: row;
    padding: 1rem;
}

.adres-edit-input-item {
    display: flex;
    flex-direction: column;
    margin-right: .5rem;
}


.vDataTable-table {
    margin: 0 !important;
    padding: 0 !important;
}

.beheer-studiematerialen-items {
    margin: 1% !important;
    padding: 1% !important;
}

.beheer-studiematerialen-cursusBestanden {
    margin-bottom: 2%;
}

.beheer-studiematerialen-beschikbaarheid {
    margin-bottom: 2%;
}
.beheer-studiematerialen-stock{
    margin-bottom: 2% ;
}

.vDataTable-header,
.vDataTable-body-row-td-index,
.vDataTable-body-row-td-actions {
    background-color: #c0c0c0 !important;
}

/*.vDataTable-body-row {
    background-color: #1e1e1e26 !important;
}*/

/* Filters: Herwerking beheer studiematerialen */

.beheer-sm-filter-container {
    display: flex;
    flex-direction: row;
    margin-top: 1rem;
    justify-content: space-between;
}

.beheer-sm-filters-group-top {
    display: flex;
    justify-content: space-between;
    padding-top: 1rem;
    padding-bottom: 1rem;
    padding-bottom: .5rem;
    align-items: flex-end;
}

.beheer-sm-filters-group-left {
    display: flex;
    justify-content: flex-start;
}

.beheer-sm-filters-group-right {
    display: flex;
    justify-content: flex-end;
}

.beheer-sm-filter-item {
    display: flex;
    flex-direction: column;
    margin-bottom: 1rem;
}

.OAFilterComponent-filters-items {
    max-width: 45%;
}

.OAFilterComponent-filters-items:first-child {
    margin-right: 1rem;
}

.beheer-sm-filter-item-button {
    display: flex;
    align-content: center;
    flex-direction: column;
    margin-right: 1rem;
    justify-content: space-between;
}

.beheer-sm-filters {
    display: flex;
    flex-direction: row;
}

.beheer-sm-filter-input-item {
    display: flex;
    flex-direction: column;
}
/* OA Filter Component */
.OAFilterComponent-container {
    display: flex;
    flex-direction: row;
}

.OAFilterComponent-filters-container {
    background-color: rgba(247, 247, 244);
    border: 1px solid rgb(30, 30, 30, 25%);
    border-radius: 4px;
    margin-top: 1rem;
    padding: 1rem;
}

/* nog kijken om het component onder de gewone filters laten tonen. */
.OAFilterComponent-filters-inner-container {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

@media screen and (max-width: 1120px) {
    .OAFilterComponent-filters-inner-container {
        flex-direction: column;
    }

    .OAFilterComponent-filters-container {
        width: 50%;
    }

    .OAFilterComponent-filters-items {
        max-width: 100%;
    }
}

.OAFilterComponent-filters-action-container {
    margin-top: 2rem;
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

.OAFilterComponent-filters-action-container button {
    margin-left: 2rem;
}

.beschikbaarheid-checkbox-container {
    display: flex;
    flex-direction: row !important;
    align-items: center;
    justify-content: center !important;
    flex-wrap: nowrap !important;
}

.beschikbaarheid-checkbox-input-item,
.beschikbaarheid-checkbox-label-item {
    width: max-content !important;
}

.summary-filters-container {
    margin-top: 1rem;
    margin-bottom: 1rem;
    display: flex;
    justify-content: flex-start;
    flex-direction: row;
    font-style: italic;
}

/* BeheerStudiematerialen Component: Beschikbaarheden */

.beheer-beschikbaarheden-table {
    width: 100%;
    border-collapse: collapse;
    background-color: white !important;
}

.beheer-beschikbaarheden-table-head
.beheer-beschikbaarheden-table-d {
    border: 1px solid #ddd;
    padding: 8px;
}

.beheer-beschikbaarheden-table-head {
    background-color: #f2f2f2;
    text-align: left;
}

.beheer-beschikbaarheden-table-row:nth-child(even) {
    background-color: #f9f9f9;
}

.beheer-beschikbaarheden-table-row:hover {
    background-color: #ddd;
}

.beheer-beschikbaarheden-inputs-container {
    display: flex;
    flex-direction: column;
}

.beheer-beschikbaarheden-input-item {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    padding-bottom: .5rem;
}

.beheer-beschikbaarheden-values {
    padding: 1rem;
    margin-bottom: .25rem;
}

.aanbod-label {
    font-weight: bold;
}

/* input[type="text"], input[type="date"] {
        width: 100%;
        padding: 5px;
        margin-top: 5px;
        box-sizing: border-box;
      
} */

.studiemateriaal-geen-beschikbaarheden {
    font-style: italic;
}
.studiemateriaal-beschikbaarheden-title {
    font-weight: bold;
    margin: 0 !important;
    padding: 0 !important;
}

.studiemateriaal-beschikbaarheden-item {
    font-weight: normal;
}

.studiemateriaal-beschikbaarheden-item-td {
    padding: 1rem;
}

.studiemateriaal-beschikbaarheden-value-diploma {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
}

.beschikbaarheden-sg-aj-table-row {
    background-color: #C0C0C0;
    font-weight: bold !important;
    border: 1px solid #8f8f8f !important;
}

.studiemateriaal-beschikbaarheden-title-aj,
.studiemateriaal-beschikbaarheden-item-aj,
.studiemateriaal-beschikbaarheden-title-sg,
.studiemateriaal-beschikbaarheden-item-sg {
    font-weight: bold !important
}
.beschikbaarheden-values-table-row {
    background-color: #F7F7F4 !important;
}


.beschikbaarheden-input-items-table-row {
    border: none !important;
    border-style: none !important;
    border-bottom: none !important;
}

beheer-beschikbaarheden-table-body {
    border: 1px solid #8f8f8f !important;
}


.beschikbaarheden-diploma-table-row,
.beschikbaarheden-values-table-row,
.beschikbaarheden-input-items-table-row {
    border-bottom: 1px solid #8f8f8f !important;
}
    
.beschikbaarheden-diploma-td {
    padding: 1rem !important;
    padding-bottom: 1rem !important;
}

.beheer-beschikbaarheden-value-item {
    padding: 1rem;
}

beschikbaarheden-actions-container {
    padding: 1rem;
}

.beschikbaarheden-actions-input-item {
    display: flex;
    flex-direction: column;
    margin-top: 1rem;
}

.beschikbaarheden-actions-checkbox-item {
    display: flex;
    flex-direction: row;
    margin-top: 2rem !important;
}

.beschikbaarheden-checkbox-label {
    margin-left: .5rem;
    font-weight: bold;
}

.beschikbaarheden-actions-submit-item {
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

.beheer-beschikbaarheden-btn-action {
    display: flex;
    align-items: baseline;
    justify-content: flex-end;
    border: none;
    padding: 1rem;
}

.beheer-studiematerialen-stock-container {
    display: flex;
    flex-direction: column;
    padding: 1rem;
}

.beheer-stock-info,
.beheer-stock-formule {
    display: flex;   
    justify-content: flex-start;
}

.beheer-studiematerialen-table-title {
    font-weight: bold;
    text-transform: uppercase;
    padding-bottom: .5rem;
}

/* Cursuslijsten pagina */

.cursuslijsten-filters-container {
    padding: 1rem;
    margin-bottom: 1rem;

    /* testing container */   
    background-color: #F7F7F4;
    border: 1px solid rgb(30, 30, 30, 25%);
    border-radius: 4px;
}

.cursuslijsten-filter-info {
    margin-bottom: .5rem;
}

.cursuslijsten-filter-info-title {
    font-weight: bold;
}

.cursuslijsten-filter-info-summary {
    font-weight: normal;
    margin: 0 !important;
}

.cursuslijsten-filter-head-group {
    display: flex;
    flex-direction: row;

    margin-bottom: 1rem;
}

.cursuslijsten-filter-sub-group {
    display: flex;
    flex-direction: row;
    align-items: flex-end;
}

.cursuslijsten-filter-item {
    display: flex;
    flex-direction: column;
    margin-right: .5rem;
}

.cursuslijsten-filter-btn {
    margin-right: 1rem;
}

.cursuslijsten-table-container {
    padding: 1rem;
    margin-bottom: 1rem;
}

.cursuslijsten-title {
    font-weight: bold;
    text-transform: uppercase;
}

.cursuslijsten-table-sub-title {
    margin-top: .5rem;
    margin-bottom: .5rem;
}

.cursuslijsten-table-opleiding-item {
    padding: 1rem;
}

.cursuslijsten-table-gem-vakken-item {
    background-color: #efeee9;
    padding: 1rem;
}
.cursuslijsten-table-gem-vakken-title {
    text-transform: uppercase;
    font-weight: bold;
    margin-bottom: 0 !important;
}

.cursuslijsten-table-opleiding-title,
.cursuslijsten-table-diploma-title {
    font-weight: bold;
    text-transform: uppercase;
    color: #1E1E1E;
    margin-bottom: 0 !important;
}


.cursuslijsten-table-sub-info-item {
    padding: 1rem;
}

.cursuslijsten-table-jaarvakken-title,
.cursuslijsten-table-semester-title {
    font-weight: bold;
    text-transform: uppercase;
    color: #E00020;
    margin-top: .25rem;
}

.cursuslijsten-table-fase-item,
.cursuslijsten-table-modulegroep-item {
    margin-top: .5rem;
    margin-bottom: 1rem;
    
}

.cursuslijsten-table-semester-item,
.cursuslijsten-table-jaarvakken-item {

}

.cursuslijsten-table-fase-title {
    text-transform: none;
    color: white;
    background-color: #1E1E1E;
    text-transform: uppercase;
    padding: .5rem;
    width: fit-content;
}

.cursuslijsten-table-modulegroep-title {
    color: white;
    padding: .5rem;
    background-color: #e00020;
    font-weight: bold;
    text-transform: uppercase;

}


.cursuslijsten-table-studiematerialen-item {
    padding: 1rem;
}

.cursuslijsten-table-studiematerialen-title {
    background-color: #1E1E1E !important;
    color: white;
    font-weight: bold;
    text-transform: uppercase !important;
    padding: .75rem;
    margin: 0 !important;
}
.BulkSaveButton {
    display: flex;
    align-items: center;
}

/*.cursuslijsten-studiematerialen-row:nth-child(even) {
    background-color: #F7F7F4;
    color: #1E1E1E;
}*/

.cursuslijsten-studiematerialen-row {
    background-color: #F7F7F4;
    color: #1E1E1E;
}

.cursuslisjten-studiematerialen-row {
    color: #1E1E1E;
}

.table-cursuslijsten {
    background-color: white !important;
    color: #1E1E1E;
}

.cursuslijst-filters-title {
    font-weight: bold;
    margin-bottom: .25rem;
}

.alert-cursuslijst-items {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem !important;
}


.alert-btn-info-close {
    color: #055160;
    background-color: transparent !important;
    border: none !important;
    border-style: none !important;
}

/* Vakkendropdown component */

.edit-content-btns {
    display: flex;
    justify-content: flex-end;
}

.edit-content-btn-item {
    margin-left: .5rem;
}

.vakken-dropdown-content-items {
    overflow-y: scroll;
    max-height: 60vh;
}

.vakken-dropdown-container,
.indienen-studiemateriaal-cursusBestand-container {
    color: #1E1E1E;
    padding: 1rem;
    background-color: rgb(247 247 244 / 25%);
    border-radius: 5px;
    border: 2px solid rgba(0, 0, 12, 0.05);
    height: auto;
}

.vakken-dropdown {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-self: stretch;
}

.vakken-dropdown-searchbar {
    color: #1E1E1E;
}

.vakken-dropdown-search-input {
    width: fit-content;
    color: #1E1E1E;
    padding: .5rem;
    border: 1px #c0c0c1 solid;
    border-radius: .5rem;
    background-color: #ededed;
}

    .vakken-dropdown-search-input::after {
        content: "\1F50D";
        color: #1E1E1E;
        font-size: inherit;
    }

.vakken-dropdown-expand-btn {
    background-color: transparent;
    padding: .5rem;
    color: #1E1E1E;
}

.vakken-dropdown-content-item {
    display: flex;
    padding: 1rem;
    justify-content: space-between;
    align-items: center;
    align-self: stretch;
    border: 1px solid rgba(30, 30, 30, 0.25);
    background: #ededed;
}

.vakken-dropdown-table {
    background-color: white;
    table-layout: auto;
    width: 100%;
    border-collapse: collapse;
}

@media screen and (max-width: 768px) {
    .vakken-dropdown-table > table {
        width: 100%;
        display: block;
        overflow-x: auto;
    }
}

.vakken-dropdown-item-thead {
    background-color: #1E1E1E;
    font-weight: bold;
    text-transform: uppercase;
    color: white;
    font-size: 14px;
}

.vakken-dropdown-item-thead > tr > th {
    padding: 1rem !important;
}


.vakken-dropdown-table-row > td {
    padding: 1rem;
}

.vakken-item-table-actions {
    display: flex;
    justify-content: right;
    align-content: flex-end;
    align-items: flex-end;
    flex-wrap: nowrap;
}

.vakkenDropdown-input > .vComponent-combobox-dropdown {
    max-height: 35rem !important;
}

.vDetailPanel-body {
    overflow: inherit !important;
}

.vakken-dropdown-table-row:nth-child(even) {
    background-color: #F7F7F4 !important;
}

/* Titel info component */

.beheerstudiematerialen-titel-info-input-item {
    display:flex;
    flex-direction: column;
}

.beheerstudiematerialen-titel-info-container {
    display: flex;
    flex-direction: column;
}

.vakkenDropdown-input-datalist { 
    width: 100% !important;
}

.cursuslijsten-table-opleiding-header {
    display: flex;
    justify-content: space-between;
}

.vBtn-align-items {
    display: flex;
    align-items: center;
}

.datalist-container { 
    padding: 0;
    margin-bottom: 1rem;
}

.uitwisselings-table-container {
    padding: 1rem;
}

.uitwisselings-table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 1rem;
    overflow: hidden;
}

.uitwisselings-table th, .uitwisselings-table td {
    padding: 0.75rem 1rem;
    text-align: left;
}

.uitwisselings-table thead {
    background-color: #f5f5f5;
}

.uitwisselings-table th {
    color: #1E1E1E;
    background-color: #c0c0c0 !important;
    font-weight: bold;
    border: 1px solid #8f8f8f;
}

.uitwisselings-table td {
    color: #1E1E1E;
    border: 1px solid #8f8f8f;
}

.uitwisselings-table td:last-child {
    font-weight: 500;
}

/* Vervanghandboek Component */

.vervanghandboek-combobox-row {
    /* Already uses d-flex, align-items-end, gap-3, flex-wrap from Bootstrap */
}

.vervanghandboek-combobox {
    min-width: 300px;
}

.vervanghandboek-save-btn {
    min-width: 200px;
    font-weight: 600;
    font-size: 1.1rem;
}

/* Dropdown vervang handboeken */

.dossier-component-combobox > .vComponent-combobox-dropdown,
.dossier-input-combobox-container > .vComponent-combobox-dropdown,
.dossier-dropdown-list > .vComponent-combobox-dropdown
{
    position: relative !important;

}
}
}

/* Stock beheer  */

.afdruktaken-page {

}

.afdruktaken-filters-container {
    padding: 1rem;
}

.afdruktaken-filters-item-group {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.afdruktaken-filter-item {
    display: flex;
    flex-direction: column;
    margin-right: .5rem;
}

.afdruktaken-clear-filter-item {
    display: flex;
    flex-direction: column;
    margin-right: .5rem;
    justify-content: flex-end;
}

.afdruktaken-actions-container {
    padding: 1rem;
}

.afdruktaken-actions-item {

}

.afdruktaken-clear-filter-item {

}

.afdruktaken-table {
    margin-top: 1rem;
    margin-bottom: 1rem;
}

/* Stockbeheer form */

.stockbeheer-container {
    display:flex;
    flex-direction: column;
}

.cursusbestand-info-container,
.studiemateriaal-info-container {
    padding: 1rem;
}

.cursusbestand-info-items,
.studiemateriaal-info-items {
    display: flex;
    flex-direction: column;
}

.cursusbestand-info-item,
.studiemateriaal-info-item {
    margin-bottom: .5rem;
}

.studiemateriaal-info-label,
.cursusbestand-info-label{
    font-weight: bold;
    color: #1E1E1E;
}

.studiemateriaal-info-value
.cursusbestand-info-value{
    font-weight: normal;
    color: #1E1E1E;
}

.stockorderbeheer-table {
    padding: 1rem;
}

.printOrders-filter-container {
    display: flex;
    flex-direction: row;
    padding: 1rem;
}

.printOrder-filter-item {
    margin-right: 1rem;
}

.leveranciers-action-container {
    display: flex;
    justify-content: flex-end;
    margin-bottom: -.6rem;
    margin-right: -1rem;
}

.stockOrders-action-container {
    display: flex;
    justify-content: flex-end;
    margin-bottom: -2.6rem;
}

.afdruktaken-action-item {
    display: flex;
    justify-content: flex-end;
    padding: 1rem;
}

.stockorder-beheer-events-container {
    padding: 1rem;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.stockorder-beheer-actions-item {
    margin-bottom: .25rem;
}

.stockOrder-beheer-action-btn {

}

.stockorderbeheer-leverancier-info-items {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-content: flex-start;
    align-items:center;
}

.stockorderbeheer-leverancier-info {
    margin-bottom: 1rem;
}

.stockorderbeheer-leverancier-container {
    display: flex;
    flex-direction: column;
    padding: .5rem;
    justify-content: flex-start;
}

.besteld-info-item {
    font-style: normal;
}

.stockorderbeheer-bestellen-input-item {
    display: flex;
    flex-direction: column !important;
    justify-content: flex-start;
}

.stockorderbeheer-btns-container {
    display: flex;
    flex-direction: row;
    margin-top: 2rem;
}

.stockorderbeheer-btn-item {
    margin-right: 1rem;
}

.vBtn-popup-align {
    display: flex;
    justify-content: flex-end;
    padding: 1rem;
}

.leverancier-naam {
    text-transform: uppercase;
    margin-bottom: .25rem;
}

.stockorderbeheer-bestellen-input {
    margin-left: 1.5rem;
}

.stockorderbeheer-ondemand-check {
    margin-left: 1rem;
    
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start
}

.stockorderbeheer-leverancier-check {
    display: flex !important;
    flex-direction: row !important;
    justify-content: flex-start;
    align-content: flex-start;
    align-items: flex-start;
}

.stockorderbeheer-bestellen-btn {
    margin-left: .5rem;
}


.leverancier-switch-label,
.ondemand-switch-label {
    margin-left: .5rem;
}

.popup-width-test {
    width: max-content; 
    padding: 1rem;
}

.stockbeheer-header-container,
.handboek-header-container,
.beschikbaarheid-header-container,
.cursusbestand-header-container,
.beheer-studiematerialen-title-container {
    display: flex;
    justify-content: space-between;
    flex-direction: row;
    align-items: center;
}

.beschikbaarheden-diploma-vcollapse-label {
    text-decoration: underline;
    font-weight: bold;
}

.vcollapse-header {
    align-items: baseline !important;
    display: flex;
    cursor: pointer;
    padding: 1rem;
}

.aantalGevraagd-input-container,
.stockorder-beheer-aantalGeleverd-container {
    display: flex;
    justify-content: flex-start;
    flex-direction: row;
}

.aantalGevraagd-input-item {
    display: flex;
    min-width: 75px !important;
}

.vBtn-spacing-aantalGevraagd {
    margin-left: 1rem;
}

.opmerkingen-studiemateriaal-popup {
    flex-direction: column;
    padding: 1rem;
}

.opmerking-input-container {
    display: flex;
    justify-content: space-between;
    margin-top: 1rem;
}
.opmerkingen-studiemateriaal-btn {
    display: flex;
    justify-content: flex-end;
    width: fit-content;
    margin-left: 1rem;
}

.opmerking-message-container {
    display: flex;
    flex-direction: column;
}

.opmerking-timestamp {
    color: #4A4A4A;
    font-size: .75rem;
    margin-bottom: .25rem;
}

.opmerking-message {
    color: #1E1E1E;
    font-size: 1rem;
}

.inline-button-right {
    display: flex;
    justify-content: space-between;
}

.inline-button-right .btn-container {
    display: flex;
    flex-direction: row;
    width: 100%;
    justify-content: flex-end;
}

.btn-container .btn {
    min-width: 70px;
}
}

.stockorderbeheer-bestellen-container {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-end;
}

.beschikbaarheden-diploma-items {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

.vcollapse-beheer-container > .stockorderbeheer-leverancier-info-items {
    min-width: max-content;
}

.beheer-sm-bulk-actions-container {
    display: flex;
    align-items: baseline;
    justify-content: flex-end;
    flex-direction: row;
}

.beschikbaarheden-values-table-row > td {
    padding: 1rem;
}

.beschikbaarheden-input-items-table-row > td {
    padding: 1rem;
}

.vcollapse-content, div.vcollapse-content, .vcollapse-content:last-child {
    padding-bottom: .5rem !important;
    margin-bottom: 0 !important;
}

.campus-overzicht-graph-spinner-container {
    display: flex;
    width: 100%;
    justify-content: center;
    margin-top: 5rem;
    margin-bottom: 5rem;
}

.campus-overzicht-graph-spinner {
    border: 27px solid transparent;
    border-top-width: 27px;
    border-top-style: solid;
    border-top-color: transparent;
    border-left-width: 27px;
    border-left-style: solid;
    border-left-color: transparent;
    border-top: 27px solid #e00020;
    border-left: 27px solid #e00020;
    border-radius: 50%;
    width: 100px;
    height: 100px;
    animation: campus-overzicht-graph-spinner-animation 1s linear infinite;
}

@-webkit-keyframes campus-overzicht-graph-spinner-animation {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes campus-overzicht-graph-spinner-animation {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

.header-first-row {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.header-first-row-link {
    width: auto;
}

.header-first-row-login-display-container {
    margin-top: 0rem;
}

.header-second-row {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    margin-top: 3rem !important;
    margin-bottom: 3rem !important;
}

.header-second-row-search-container {
    width: 100%;
}

.search-component-container {
    display: flex;
    flex-direction: row;
    align-items: flex-end;
    width: 100%;
}

.search-component-input-container {
    display: flex;
    flex-direction: row;
    width: 100%;
}

.search-component-input {
    margin-right: 1rem;
}

.search-component-input-full-width {
    width: 100%
}

.search-component-select-container {
    display: flex;
    flex-direction: row;
}

.search-component-select {
    padding: .6rem;
}

.search-component-reset-btn {
    margin-left: 1rem;
    margin-right: 1rem;
    border: none;
    background: none;
}

.search-component-search-btn {
    margin-right: 1rem;
}

@media screen and (max-width: 930px) {
    .search-component-container {
        flex-direction: column;
    }

    .search-component-input-container {
        margin-bottom: 1rem;
    }
}





.totaalTeCrediteren-label {
    font-weight: bold;
}

.digitale-aankopen-title,
.verzendkosten-title {
    font-weight: bold;
    margin-bottom: 1rem;
    margin-top: 1rem;
}

.edit-align-items-btn {
    display: flex;
    align-items: center;
}

.creditatie-items-container {
    display: flex;
    flex-direction: row !important;
}

.totaal-container {
    display: flex;
    flex-direction: row;
    margin-left: 1rem;
}

.totaal-value {
    margin-left: .5rem;
}

.admin-page-refresh-btn-container {
    width: 100%;
    display: flex;
    justify-content: flex-end;
}

    .admin-page-refresh-btn-container,
    .admin-page-content-container {
        margin-top: 3rem;
        margin-bottom: 3rem;
    }

.admin-page-content-title {
    margin-bottom: 1rem;
}

.admin-page-content-label {
    font-weight: bold;
}

.login-header-container {
    display: flex !important;
    flex-direction: row !important;
}

.manager-menu-items {
    margin-left: 1rem;
}

.account-menu-items {
}

.surrounddropdowndiv {
    border-radius: 5px !important;
}

.nav-link-manager-item {
}

.nav-link-manager-item:hover {
    font-weight: normal;
    background-color: #efeee9;
    border-radius: 5px;
}

.dropdown-menu.show {
    position: absolute;
    display: inline-block !important;
    width: max-content;
    inset: 0px auto auto 0px;
    margin: 0px;
    transform: translate(-250px, 50px);
}

/* Instellingen pagina */

.cursus-management-instellingen-container {
    display: flex;
    justify-content: flex-start;
    flex-direction: column;
}

.print-on-demand-instelling-container {
    padding: 1rem;
}

.print-on-demand-instelling-title {
    text-transform: uppercase;
    font-weight: bold;
}

.print-on-demand-alert {
    border-radius: 5px !important;
}

.print-on-demand-info-title {
    font-weight: bold;
}

.print-on-demand-instellingen-items,
.print-on-demand-save {
    margin-top: 1rem;
}

.print-on-demand-switch-item {
    margin-bottom: 1rem !important;
    text-transform: uppercase;
    font-weight: bold;
}

/* Download menu */
.download-bestand-btn-container {
    display: flex;
    flex-direction: column;
    white-space: nowrap;
}

.bestand-actions-btn-container {
    display: flex;
    flex-direction: column;
    font-size: smaller;
}

.download-bestand-btn:first-of-type {
    background-color: #e00020 !important;
}

.download-bestand-btn {
    color: white !important;
    background-color: #6c757d;
    text-align: left;
    padding: 0.2rem 0.5rem;
    border: none;
    margin-bottom: 0.1rem;
    border-radius: 0.2rem;
}

.download-bestand-btn:hover {
    transition: transform 0.3s ease;
    transform: scale(1.03);
}

.download-bestand-btn i {
    text-align: left;
    margin-right: 0.5rem;
}

.download-bestand-btn i:hover {
    transition: transform 0.3s ease;
    transform: scale(1.3);
}
.download-menu {
   padding: .5rem !important;
}

.diploma-btn-spacing {
    margin-right: 1rem !important;
}

/* Vakken zonder studiemateriaal */

.geen-studiematerialen-title-container {
    padding-bottom: 1rem;
}

.geen-studiematerialen-export-container {
    display: flex;
    justify-content: flex-end;
    margin-top: 1rem;
}